What does the .then function on a modifier? What i...

# compose

[Geert]

What does the .then function on a modifier?
What is the difference between

modifier = Modifier
    .then(Modifier.padding(it))
    .then(Modifier.fillMaxSize())

and

modifier = Modifier.padding(it).fillMaxSize()

[iamthevoid]

you can pass function call or expression into then

[yousefa2]

.then combines two modifiers and returns the combined one. here’s the code.

Modifier.padding , here, is just a function that wraps the usage of .then for padding

[Rob Meeuwisse]

It allows you to control in what order the modifiers are applied. Take this example:

@Composable
fun MyButton(
    onClick: () -> Unit,
    caption: String,
    modifier: Modifier = Modifier,
) {
    Button(
        onClick = onClick,
        modifier = Modifier
            .requiredHeight(48.dp)
            .then(modifier) // allows the caller to override our default height
    ) {
        Text(caption)
    }
}

And contrast to this:

modifier = modifier.requiredHeight(48.dp) // the caller's requiredHeight modifier will be ignored