by @alexstyl
✉️ Leave your feedback

← Back to Compose UI

layoutId

Modifier
in
Compose UI
. Since 0.1.0-dev15

Overview

Examples

Community Notes

@Composable
fun LayoutTagChildrenUsage(header: @Composable () -> Unit, footer: @Composable () -> Unit) {
    Layout({
        // Here the Containers are only needed to apply the modifiers. You could use the
        // modifier on header and footer directly if they are composables accepting modifiers.
        Box(Modifier.layoutId("header")) { header() }
        Box(Modifier.layoutId("footer")) { footer() }
    }) { measurables, constraints ->
        val placeables = measurables.map { measurable ->
            when (measurable.layoutId) {
                // You should use appropriate constraints. Here we measure fake constraints.
                "header" -> measurable.measure(Constraints.fixed(100, 100))
                "footer" -> measurable.measure(constraints)
                else -> error("Unexpected tag")
            }
        }
        // Size should be derived from children measured sizes on placeables,
        // but this is simplified for the purposes of the example.
        layout(100, 100) {
            placeables.forEach { it.placeRelative(0, 0) }
        }
    }
}
Next ComponentAndroidView