android - Jetpack 撰写 : How to make two columns equals height

Question

其中一行两列，左列有两个子行，右列有子行。

这是我的代码:

@Preview(showBackground = true)
    @Composable
    fun TwoColumns() {
        Row {
            BottomLeftLetterKey(columns = 2, rows = 2, Color.Blue)
            Spacer(modifier = Modifier.weight(1f))
            BottomLeftLetterKey(columns = 3, rows = 3, Color.Cyan)
        }
    }

    @Composable
    fun BottomLeftLetterKey(columns: Int, rows: Int, color: Color) {
        Column(modifier = Modifier.background(color)) {
            repeat(columns) {
                Row {
                    repeat(rows) {
                        ElevatedButton(onClick = { /*TODO*/ },
                            shape = RoundedCornerShape(4.dp),
                            colors = ButtonDefaults.elevatedButtonColors(containerColor = Color.Green, contentColor = Color.Red),
                            contentPadding = PaddingValues(0.dp)
                        ) {
                            Text(text = "2")
                        }
                    }
                }
            }
        }
    }

我希望两列高度相同。即蓝色柱应与青色柱高度相同。

我尝试设置: Column(modifier = Modifier.background(color).fillMaxHeight())

那么我想要的高度太高了。

有什么建议吗？谢谢!

编辑

modifier = modifier.height(IntrinsicSize.Min/Max) 是正确的方向。但困惑 Min 或 Max 哪个选项是正确的？我试过了，效果是一样的。

来自doc :

The Row composable's minIntrinsicHeight will be the maximum minIntrinsicHeight of its children.

似乎 IntrinsicSize.Min 是正确的，而不是 IntrinsicSize.Max。

Answer 1

您必须将 Modifier.height(IntrinsicSize.Min) 应用于 Row，并将 fillMaxHeight() 修饰符应用于 列。

Row(
    modifier = Modifier.height(IntrinsicSize.Min),
    horizontalArrangement = Arrangement.SpaceBetween
) {
    BottomLeftLetterKey(columns = 2, rows = 2, Color.Blue)
    BottomLeftLetterKey(columns = 3, rows = 3, Color.Cyan)
}


@Composable
fun BottomLeftLetterKey(columns: Int, rows: Int, color: Color) {
    Column(modifier = Modifier
        .fillMaxHeight()  //<--- fill max height
        .background(color)
    ) {
        //....
    }
}