使用 Compose ConstraintLayout 时如何处理丢失/“消失”的视图

Question

我正在尝试使用 Jetpack Compose ConstraintLayout，如果所有视图都可见，则说明效果很好。但如果缺少其中一个视图，沙堡就会倒塌。

例如，如果视图是可选的，我会这样管理它：

val (text1, text2) = createRefs()

ConstraintLayout {
    if (myTextStr.isNotEmpty()) {
        Text(
            text = myTextStr,
            modifier = Modifier
                .constrainAs(text1) {
                    start.linkTo(parent.start)
                    bottom.linkTo(parent.bottom)
                })
    }
    Text(
        text = myTextStr2,
        modifier = Modifier
            .constrainAs(text2) {
                start.linkTo(parent.start)
                bottom.linkTo(text1.top)
            })
}

但是，如果第一个 Text 元素丢失，则所有布局都会被破坏，因为第二个 Text 位置取决于它。

一种可能性是保留文本视图，但0.dp如果 myTextStr 为 null 或为空，则将高度设置为。但我想确保 Compose ConstraintLayout 没有提供更干净的方法来实现此目的

Answer 1

您是否尝试过 constrainAs 内的可见性属性？

// ...
Modifier
  .constrainAs(title) { 
      bottom.linkTo(profilePic.top, margin = 16.dp) 
      start.linkTo(parent.start) 
      visibility = if (isTitleVisible) Visibility.Visible else Visibility.Gone 
}
// ...