ConstraintLayout：如果从属视图可见性设置为 GONE，则重新对齐基线约束答案

【问题标题】：ConstraintLayout: Realign baseline constraint in case if dependent view visibility was set to GONEConstraintLayout：如果从属视图可见性设置为 GONE，则重新对齐基线约束
【发布时间】：2021-02-17 09:00:41
【问题描述】：

如果从属视图可见性设置为 GONE，是否有任何方法可以重新调整 TextView 的基线约束？

我的布局代码：

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TEST TITLE"
        android:textColor="@color/black"
        android:textSize="24sp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

    <TextView
        android:id="@+id/subtitle1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="SUBTITLE 1"
        android:textSize="11sp"
        app:layout_constraintBaseline_toBaselineOf="@+id/subtitle2"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/subtitleSpace"
        app:layout_constraintRight_toRightOf="parent"/>

    <android.support.v4.widget.Space
        android:id="@+id/subtitleSpace"
        android:layout_width="12dp"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/subtitle1"
        app:layout_constraintRight_toLeftOf="@+id/subtitle2"/>

    <TextView
        android:id="@+id/subtitle2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:text="SUBTITLE 2"
        android:textSize="14sp"
        app:layout_constraintLeft_toRightOf="@+id/subtitleSpace"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/title"/>

</android.support.constraint.ConstraintLayout>

在这种情况下，我的布局如下所示：

当我将 subtitle2 TextView 可见性设置为 GONE 时，我的布局将如下所示：

所以我想知道如果缺少依赖视图，是否有一些约束可以重新对齐基线。

【问题讨论】：

标签： android android-constraintlayout

【解决方案1】：

可以为GONE 小部件指定备用边距（请参阅Margins when connected to a GONE widget），但我不知道基线有这种替代方法。

满足您要求的一种方法是指定一个0dp 不可见TextView，它与放置在同一视图旁边的GONE TextView 具有相同的特征。 subtitle1 和 subtitle2 将绑定到这个新的 TextView 的基线。即使新的TextView 没有显示在屏幕上并且宽度为零，它仍然保持基线。

现在，当subtitle2 变为GONE 时，subtitle1 将移动到中心但保持其垂直位置。（用空文本指定 0dp 和 invisible 是多余的，但可以清楚地表明该小部件不应出现。）

以下是具有这些更改的 XML：

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TEST TITLE"
        android:textColor="#FF000000"
        android:textSize="24sp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />

    <TextView
        android:id="@+id/subtitle1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="SUBTITLE 1"
        android:textSize="11sp"
        app:layout_constraintBaseline_toBaselineOf="@+id/viewForBaseline"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/subtitleSpace"
        app:layout_constraintRight_toRightOf="parent" />

    <android.support.v4.widget.Space
        android:id="@+id/subtitleSpace"
        android:layout_width="12dp"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toRightOf="@+id/subtitle1"
        app:layout_constraintRight_toLeftOf="@+id/subtitle2" />

    <TextView
        android:id="@+id/subtitle2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:text="SUBTITLE 2"
        android:textSize="14sp"
        android:visibility="gone"
        app:layout_constraintBaseline_toBaselineOf="@+id/viewForBaseline"
        app:layout_constraintLeft_toRightOf="@+id/subtitleSpace"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/title" />

    <TextView
        android:id="@+id/viewForBaseline"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:textSize="14sp"
        android:visibility="invisible"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/title" />

</android.support.constraint.ConstraintLayout>

【讨论】：

感谢您的建议！我已经应用了与您提出的相同的解决方案，但仍然想知道GONE 文本视图基线是否存在一些限制。我真的不想在我的布局中留下空视图以避免复杂化并保持它更清洁。
我认为这个问题的答案是没有，但有这样的东西是有道理的。

【解决方案2】：

您可以在 xml 代码之外以编程方式执行此操作。这不是理想的解决方案，但你最终会得到你想要的一组精确的约束。基本思路：

private val defaultConstrainSet = ConstraintSet()
private val newConstrainSet = ConstraintSet()

init {
    defaultConstrainSet.clone(constraintLayout)
    newConstrainSet.apply {
        clone(constraintLayout)
        // here put your new constrains, eg. :
        clear(R.id.subtitle1, ConstraintSet.BASELINE)
        connect(R.id.agenda_index, ConstraintSet.TOP, R.id.title, ConstraintSet.BOTTOM)
    }
}

然后

    if (/* subtitle2 is visible */) {
        defaultConstrainSet.applyTo(constraintLayout)
    } else {
        newConstrainSet.applyTo(constraintLayout)
    }

【讨论】：