如何在 Jetpack Compose 中提供相对大小

【问题标题】：How to provide relative sizes in Jetpack Compose如何在 Jetpack Compose 中提供相对大小
【发布时间】：2021-06-05 06:02:44
【问题描述】：

我有一个 Box 布局，我想相对于父框的大小来布局子视图。这可以在 SwiftUI 中使用 Geometry Reader 实现。如何在 Jetpack Compose 中实现类似的功能？

【问题讨论】：

使用Row 或Column 而不是Box 并应用Modifier.weight
我必须使用 Box，因为我需要堆叠多个不同大小的 CircularProgressIndicator 视图。 Box 中没有可供使用的重量选项。

标签： android kotlin android-jetpack android-jetpack-compose

【解决方案1】：

您可以使用BoxWithConstraints 代替Box。
您可以使用内容 lambda 范围内的measurement constraints。

类似：

BoxWithConstraints {
    Box(Modifier.width(maxWidth*0.7f).height(30.dp).background(Color.Blue))
    Box(Modifier.width(maxWidth*0.3f).height(30.dp).background(Color.Yellow))
}

否则，您可以将 Box 和 fillMaxWidth 和 fillMaxHeight 修饰符与分数一起使用。

Box(){
    Box(Modifier.fillMaxWidth(0.7f).height(30.dp).background(Color.Blue))
    Box(Modifier.fillMaxWidth(0.3f).height(30.dp).background(Color.Yellow))
}

【讨论】：

感谢您的回答，但我能够通过在 Box 的修饰符上使用 onGloballyPositioned 来完成它。