Row
A layout composable that places its children in a horizontal sequence.
Properties
Row Properties
Children Properties
Preview
A
B
C
Generated Code
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
@Composable
fun MyRow() {
Row(
modifier = Modifier
.fillMaxWidth()
.height(IntrinsicSize.Min),
horizontalArrangement = Arrangement.Start,
verticalAlignment = Alignment.Top
) {
Box(
modifier = Modifier
.padding(8.dp)
.background(Color.Red)
) {
Text(
text = "A",
modifier = Modifier.align(Alignment.Center)
)
}
Box(
modifier = Modifier
// This aligns this specific child, overriding the Row's alignment
.align(Alignment.Top)
.padding(8.dp)
.background(Color.Green)
) {
Text(
text = "B",
modifier = Modifier.align(Alignment.Center)
)
}
Box(
modifier = Modifier
// This child will take up space proportionally to its weight
.weight(1.0f)
.padding(8.dp)
.background(Color.Blue)
) {
Text(
text = "C",
modifier = Modifier.align(Alignment.Center)
)
}
}
}