Android ConstraintLayout layout_constrainedWidth使用

问题

有个需求，在一行中显示收件人姓名和电话，分别显示在行的两端，如下图所示

布局代码如下

XML 复制代码

        <TextView
            android:id="@+id/contact"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:clickable="false"
            android:ellipsize="end"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:maxLines="1"
            android:text='收货人：李想'
            android:textColor="@color/black1"
            android:textSize="14dp"
            app:layout_constraintBottom_toTopOf="@id/address"
            app:layout_constraintStart_toEndOf="@id/tv_first"
            app:layout_constraintEnd_toStartOf="@id/phone"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintHorizontal_chainStyle="spread_inside"/>
        <TextView
            android:id="@+id/phone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:clickable="false"
            android:ellipsize="end"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:maxLines="1"
            android:text="16600000000"
            android:textColor="@color/black1"
            android:textSize="14dp"
            app:layout_constraintTop_toTopOf="@id/contact"
            app:layout_constraintBottom_toBottomOf="@id/contact"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/contact"
            app:layout_constraintHorizontal_chainStyle="spread_inside"/>

在联系人长度比较短的情况下，可以正常显示，但是当联系人内容太长的情况，整行的内容会超出两端，连左右的margin都不生效了，如下图所示

解决方案

只需添加app:layout_constrainedWidth="true"即可，如下代码所示

XML 复制代码

        <TextView
            android:id="@+id/contact"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:clickable="false"
            android:ellipsize="end"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:maxLines="1"
            android:text='收货人：理想很丰满现实很骨感理想很美好现实很残酷'
            android:textColor="@color/black1"
            android:textSize="14dp"
            app:layout_constraintBottom_toTopOf="@id/address"
            app:layout_constraintStart_toEndOf="@id/tv_first"
            app:layout_constraintEnd_toStartOf="@id/phone"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintHorizontal_chainStyle="spread_inside"
            app:layout_constrainedWidth="true"/>
        <TextView
            android:id="@+id/phone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:clickable="false"
            android:ellipsize="end"
            android:focusable="false"
            android:focusableInTouchMode="false"
            android:maxLines="1"
            android:text="16600000000"
            android:textColor="@color/black1"
            android:textSize="14dp"
            app:layout_constraintTop_toTopOf="@id/contact"
            app:layout_constraintBottom_toBottomOf="@id/contact"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/contact"
            app:layout_constraintHorizontal_chainStyle="spread_inside"
            app:layout_constrainedWidth="true"/>

效果如下

由于设置了android:ellipsize="end"，所以超出的部分会显示省略号...