How to pass children in Jetpack Compose to a custom composable?

user_13215280 0
Viewed 7784

I am curious if it is possible to pass in composables to a custom composables block. Which is then rendered in its definition. I was thinking a vararg + function literal approach could be taken and couldn't find any information.

//definition
@Composable
fun Content() {
    Row(modifier = Modifier.fillMaxWidth()) {
        //insert a(), b(), ..., z() so that they render in the row
    }
}

//usage
Content() {
    a()
    b()
    ...
    z()
}

Does something like this exist already? You are able to use Jetpack Compose this way. The row implementation must handle the Text somehow.

Row(){
    Text("a")
    Text("b")
    Text("c")
}
android-jetpack-compose android
1 Answers

After looking at the implementation of Row, RowScope and finding this piece of documentation. This can be achieved by the following code sample. The content function parameter with the type of @Composable() () -> Unit gets passed down into the row.

//definition
@Composable
fun MyCustomContent(
    modifier: Modifier = Modifier,
    content: @Composable() () -> Unit
) {
    Row(modifier = modifier) {
        content()
    }
}

//usage
MyCustomContent() {
    a()
    b()
    z()
}
user_132152800
Related