We just launched Compose Examples featuring over 150+ components! Check it out →

fillMaxWidth

Common

Modifier in Compose Foundation Layout

Have the content fill (possibly only partially) the [Constraints.maxWidth] of the incoming measurement constraints, by setting the [minimum width][Constraints.minWidth] and the [maximum width][Constraints.maxWidth] to be equal to the [maximum width][Constraints.maxWidth] multiplied by [fraction]. Note that, by default, the [fraction] is 1, so the modifier will make the content fill the whole available width. If the incoming maximum width is [Constraints.Infinity] this modifier will have no effect.

Last updated:

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation-layout:1.8.0-alpha01")
}

Overloads

@Stable
fun Modifier.fillMaxWidth(@FloatRange(from = 0.0, to = 1.0) fraction: Float = 1f)

Parameters

namedescription
fractionThe fraction of the maximum width to use, between 0 and 1, inclusive.Example usage:

Code Examples

SimpleFillWidthModifier

@Composable
fun SimpleFillWidthModifier() {
    Box(Modifier.fillMaxWidth().background(Color.Red), contentAlignment = Alignment.Center) {
        Box(Modifier.size(100.dp).background(color = Color.Magenta))
    }
}

FillHalfWidthModifier

@Composable
fun FillHalfWidthModifier() {
    Box(Modifier.requiredSize(100.dp).background(Color.Red), contentAlignment = Alignment.Center) {
        // The inner Box will be (50.dp x 30.dp).
        Box(
            Modifier.fillMaxWidth(fraction = 0.5f)
                .requiredHeight(30.dp)
                .background(color = Color.Magenta)
        )
    }
}
by @alexstyl