androidkotlinandroid-jetpack-compose

Analogue match parent in compose


Is there any analog of match parent in compose? How can I make the red and blue text the same height if the blue text is shorter? I want to ensure that the remaining part is filled with blue to the size of the red text.

@Composable
fun FilterPreview() {
    Row(
        modifier = Modifier.wrapContentHeight(),
        horizontalArrangement = Arrangement.SpaceBetween,
    ) {
        Text(modifier = Modifier
            .weight(1f)
            .background(Color.Red), text = "slfdsfkld77777777777777777777777777777777777777777777skfkdlsfkldskfkdlkfldskflkdlskflsdkflds")
        Text(modifier = Modifier
            .weight(1f)
            .background(Color.Blue), text = "44444444444444444444444444444444444444444444444444444444")
    }
}

I tried various combinations of fillMaxSize, height(IntrinsicSize.Max), height(IntrinsicSize.Min), etc.

Вот что у меня получается


Solution

  • As far as I understand you want to keep all item's heights the same as the tallest child's height in a Row!

    Row(
        modifier = Modifier.wrapContentHeight()
        .height(intrinsicSize = IntrinsicSize.Max) // *** important
        , horizontalArrangement = Arrangement.SpaceBetween,
    ) {
        Text(modifier = Modifier
            .weight(1f)
            .fillMaxHeight() //*** important
            .background(Color.Red), text = "Compose\nis\ncool\n!!!")
        Text(modifier = Modifier
            .weight(1f)
            .fillMaxHeight() //*** important
            .background(Color.Blue), text = "I am a short text")
    }
    

    enter image description here