Android TextView文字过长将后面View挤出屏幕解
2023-07-31 本文已影响0人
雨田Android开发
前言
需求:横排两个 TextView ,第一个 TextView 宽度自适应,第二个 TextView 宽度固定且跟随在 TextView 后面。
第二个View可为任意View,宽度需已知,需要第一个View margin出相应宽度给第二个 View。
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/x2_dp"
android:layout_marginEnd="@dimen/x60_dp"
android:ellipsize="end"
android:fontFamily="sans-serif-medium"
android:singleLine="true"
android:textColor="@color/color_FFFFFF"
android:textSize="@dimen/font_14sp"
app:layout_constrainedWidth="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="测试测试测试测试测试测试测试测试测试测试测试测试测试测试" />
<TextView
android:layout_width="@dimen/x60_dp"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/x6_dp"
android:fontFamily="sans-serif-medium"
android:paddingStart="@dimen/x5_dp"
android:paddingEnd="@dimen/x5_dp"
android:text="@string/vip"
android:textSize="@dimen/font_10sp"
app:layout_constraintBottom_toBottomOf="@+id/tvName"
app:layout_constraintStart_toEndOf="@+id/tvName"
app:layout_constraintTop_toTopOf="@+id/tvName" />
</androidx.constraintlayout.widget.ConstraintLayout>
关键代码:
android:layout_marginEnd="@dimen/x60_dp"
给第二个view 留出所需宽度
app:layout_constraintEnd_toEndOf="parent"
app:layout_constrainedWidth="true"
app:layout_constraintHorizontal_bias="0"
发现一种更好的写法,对比上面不需要预留空间给第二个view,且第二个view宽度可变
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_dp10"
android:ellipsize="end"
android:lines="1"
android:textColor="@color/publish_color_2B2E34"
android:textSize="@dimen/ui_sp14"
app:layout_constrainedWidth="true"
app:layout_constraintEnd_toStartOf="@+id/tv_label"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/tv_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="@dimen/ui_dp4"
android:paddingStart="@dimen/ui_dp2"
android:paddingEnd="@dimen/ui_dp2"
android:textColor="@color/cui_color_white"
android:textSize="@dimen/ui_sp10"
app:layout_constraintBottom_toBottomOf="@+id/tv_title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/tv_title"
app:layout_constraintTop_toTopOf="@+id/tv_title" />
</androidx.constraintlayout.widget.ConstraintLayout>
首先使用链式将两个view链接起来,设置链接模式为 packed,然后在第一个view添加属性
app:layout_constrainedWidth="true"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="packed"