撰写布局：相对于居中项目对齐（例如 toRightOf）

Question

Compose 中有没有一种方法可以在不使用 的情况下将可组合项与居中项目对齐ConstraintLayout？

我想实现这个目标：

我可以使用 aSpacer和Weights这样的

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.Center,
    verticalAlignment = Alignment.CenterVertically,
) {

    Spacer(Modifier.weight(1f))
    Button(...)
    Label(Modifier.weight(1f),...)
}

问题是我显示Label有条件地显示，如果我隐藏带有权重的两个元素，按钮会稍微移动。

也不确定使用权重是否会比ConstraintLayout一开始对性能产生更大的影响。

Answer 1

这Modifier.weight是创建此类布局的正确方法。我不确定性能是否比 更好ConstraintLayout，但肯定不会更差。

如果遇到性能问题，您应该在 google 问题跟踪器上创建一个问题，因为这就是 Compose 的使用方式。就我个人而言，我还没有遇到任何与 相关的性能问题weight，但该技术相当新，因此不能完全排除这种可能性。

就您而言，您需要在任何给定时间都有一些代表，您可以向其申请Modifier.weight。您可以使用if-else并添加Spacer以防else万一，但我更喜欢与可选内容一起使用Box：它看起来更干净，并且在您添加动画的情况下可以正常工作。

默认Box contentAlignment值为Alignment.TopStart，它将完全按照您的情况需要工作，但在其他一些情况下，您可以覆盖它或Spacers在内部添加更多内容。

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.Center,
    verticalAlignment = Alignment.CenterVertically,
) {
    Spacer(Modifier.weight(1f))
    Button(...)
    Box(Modifier.weight(1f)) { 
        if (condition) {
            Label(...)
        }
    }
}