How to shrink first TextView rather than second one if 2 TextView have long text in ConstraintLayout？

Question

I want 2 TextView connected together. And if the first contains more text, it should shrink. At the same time, the 2nd one should always show all the text and can not shrink. It should append to the end of the parent view, should not go out of bound How can I achieve this?

What I tried

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="40dp"
android:paddingTop="2dp"
android:paddingBottom="2dp">
<com.makeramen.roundedimageview.RoundedImageView
    android:id="@+id/avatarImg"
    android:layout_width="24dp"
    android:layout_height="24dp"
    android:layout_marginStart="4dp"
    android:scaleType="centerCrop"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:riv_oval="true"
    tools:src="@mipmap/avatar_test" />

<TextView
    android:id="@+id/name"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:ellipsize="end"
    android:lines="1"
    android:textColor="@color/peach_red"
    android:textSize="12dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toEndOf="@+id/avatarImg"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" />

<TextView
    android:id="@+id/content"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:lines="1"
    android:textColor="@color/black1"
    android:textSize="12dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/name"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="BBBBBBBBBBBBBBBBBBBBBB" />
</androidx.constraintlayout.widget.ConstraintLayout>

The result is

Edit:

Per @Gavin Wright's answer. I also want the second one to bind to the first tightly if the text in size is short. This is the difficult point that I can achieve this... Sorry for not mentioning in advance...

Answer 1

The first TextView should have layout_width = 0dp, as this forces it to take up only the remaining width on the line. The second TextView should have layout_width = wrap_content, as this forces it to take up as much space as needed to fit its contents. I also added app:layout_constraintEnd_toStartOf="@+id/content, to the first TextView, as this is needed to enforce the relationship between the two TextViews.

This is tested and works perfectly for me:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="40dp"
android:paddingTop="2dp"
android:paddingBottom="2dp">
<com.makeramen.roundedimageview.RoundedImageView
    android:id="@+id/avatarImg"
    android:layout_width="24dp"
    android:layout_height="24dp"
    android:layout_marginStart="4dp"
    android:scaleType="centerCrop"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:riv_oval="true"
    tools:src="@mipmap/avatar_test" />

<TextView
    android:id="@+id/name"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:ellipsize="end"
    android:lines="1"
    android:textColor="@color/peach_red"
    android:textSize="12dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toEndOf="@+id/avatarImg"
    app:layout_constraintEnd_toStartOf="@+id/content"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" />

<TextView
    android:id="@+id/content"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:lines="1"
    android:textColor="@color/black1"
    android:textSize="12dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/name"
    app:layout_constraintTop_toTopOf="parent"
    tools:text="BBBBBBBBBBBBBBBBBBBBBB" />
</androidx.constraintlayout.widget.ConstraintLayout>