Down Tips

Way To Learn

Android Tips

How Spacer Filling Remaining Space on Jetpack Compose

Hey! There are so many ways of Filling the Remaining Space on a Jetpack composed with Spacer. Down Tips gives you three methods to fill the remaining space.

  1. Is there a way to achieve “fill the rest of the space” in Compose without the extra Box element wrapping the SpacerSpacer has no weight modifier, unfortunately.
Column(
    modifier = Modifier.height(120.dp).fillMaxWidth()
) {
    Text(text = "A")
    Box(modifier = Modifier.weight(1f)) {
        Spacer(Modifier.fillMaxHeight())
    }
    Text(text = "B")
}

Here is the 2nd way:

2. In case you just want to fill the remaining space to the max,  Spacer with weight(1.0f) modifier is probably what you want:

Column(
    modifier = Modifier.fillMaxWidth()
) {
    Text("Text A") // top aligned
    Spacer(modifier = Modifier.weight(1.0f)) // fill height
    Text("Text B") // bottom aligned
}

Here is the 3rd way:

Is this what you need?

Column(
    modifier = Modifier
        .height(120.dp)
        .fillMaxWidth(),
    Arrangement.SpaceBetween
) {
    Text(text = "A")
    Text(text = "B")
}

{Solved} Playback State “ACTION_STOP” in Android