英文:
How to shrink first TextView rather than second one if 2 TextView have long text in ConstraintLayout?
问题
我想要两个连接在一起的 TextView。如果第一个包含更多文本,它应该会收缩。
同时,第二个 TextView 应始终显示所有文本,不能收缩。它应该附加在父视图的末尾,不应超出边界。
我该如何实现这个?
我尝试过:
<?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>
结果如下图所示:
编辑:
根据 @Gavin Wright 的答案,如果文本尺寸较小,我还想让第二个 TextView 紧密绑定到第一个 TextView。
这是一个难点,我想实现这一点... 抱歉没有事先提到...
英文:
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...
答案1
得分: 2
第一个 TextView
应该设置为 layout_width = 0dp
,这将强制它仅占据一行中剩余的宽度。第二个 TextView
应该设置为 layout_width = wrap_content
,这将强制它占据适合其内容的空间。我还添加了 app:layout_constraintEnd_toStartOf="@+id/content"
到第一个 TextView
,因为这是需要确保两个 TextView
之间关系的。
这对我进行了测试,完全有效:
<?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>
英文:
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>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论