为 Row 中的孩子填充高度

Question

我尝试实现这种布局，但不知道如何实现：

目前看起来像这样：

使用此代码：

@Preview(widthDp = 150)
@Composable
fun Item() {
    Card(shape = RoundedCornerShape(8.dp)) {
        Row {
            Box(Modifier.background(Color.Yellow).weight(1f)) {
                SomeMoreContentWithUnknownHeight()
            }
            Box(Modifier.width(20.dp).height(IntrinsicSize.Max).background(Color.Green))
        }
    }
}

我尝试将第二个 Box 的高度设置为 IntrinsicSize.Max 但这并没有改变任何东西。我目前在 1.0.0-beta07 版中运行 Jetpack Compose

Answer 1

您必须将 Modifier.height(IntrinsicSize.Min) 应用于您的 Row 并将 .fillMaxHeight() 应用于第二个 Box。

类似于：

Card(shape = RoundedCornerShape(8.dp)) {
    Row(Modifier.height(IntrinsicSize.Min)) {
        Box(Modifier
            .background(Color.Yellow)
            .weight(1f)
            ) {
               //Box(Modifier.height(50.dp))
        }
        Box(Modifier.width(20.dp)
            .fillMaxHeight()
            .background(Color.Green)
            ){
            //........
        }
    }
}