阻止 ConstraintLayout 中的视图重叠

我正在尝试使用 ConstraintLayout 构建一个具有三个视图的简单布局：

当左视图中的文本很长时，我想看到这个：

但我得到的是这样的 - 左视图向右增长太多并隐藏了中间视图。

这是我的代码：

<android.support.constraint.ConstraintLayout
        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="match_parent">

    <TextView
            android:id="@+id/left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>
    
    <TextView
            android:id="@+id/middle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintLeft_toRightOf="@id/left"
            app:layout_constraintTop_toTopOf="parent"/>
    
    <TextView
            android:id="@+id/right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintRight_toRightOf="parent"/>

</android.support.constraint.ConstraintLayout>

到目前为止我尝试过的一些事情：

• 制作链条并尝试不同的链条样式
• 将 android:minWidth 设置为中视图以防止其被左视图挤压
• 使用Guideline防止左侧和/或中间视图向右扩展得太远

我花了大约 4 个小时试图让事情顺利进行，但到目前为止还没有成功。非常感谢帮助。

你缺少的是app:layout_constrainedWidth="true"这强制了约束Views宽度设置为wrap_content。我会把前两个链接起来TextView with packed风格和偏见0.0将链对齐到父级的左侧并将其限制到第三个TextView在右侧。这TextView右边可以在右边的约束下保持独立。

示例（假设只有左边TextView尺寸会增大）：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        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="match_parent">

    <TextView
            android:id="@+id/left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="left"
            app:layout_constrainedWidth="true"
            app:layout_constraintHorizontal_chainStyle="packed"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toLeftOf="@id/middle"
            app:layout_constraintTop_toTopOf="parent"/>

    <TextView
            android:id="@+id/middle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="middle"
            app:layout_constraintLeft_toRightOf="@id/left"
            app:layout_constraintRight_toLeftOf="@id/right"
            app:layout_constraintTop_toTopOf="parent"/>

    <TextView
            android:id="@+id/right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="right"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintRight_toRightOf="parent"/>

</android.support.constraint.ConstraintLayout>