ConstraintLayout布局下让TextView自适应布

2024-04-08  本文已影响0人  苏未_
image.png

有时候在做页面的时候,会碰到这种情况,昵称这个TextView需要适配文字的长度,且昵称后面带有一些图片标识(比如vip等级),如果昵称文字超过一定长度之后,将会阶段并以...结尾,此时就可以通过ConstraintLayout布局相关的属性实现该页面:
其中用到的属性为:
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintVertical_chainStyle="spread"
app:layout_constraintWidth_default="wrap"//主要是该属性标记TextView的内容自适应

<androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:id="@+id/img_avatar"
                android:layout_width="56dp"
                android:layout_height="56dp"
                android:layout_marginStart="15dp"
                android:layout_marginTop="68dp"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:shape_radius="38dp"
                app:shape_strokeColor="@color/white"
                app:shape_strokeWidth="2dp" />


            <TextView
                android:id="@+id/tv_user_name"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:ellipsize="end"
                android:maxLines="1"
                android:textColor="@color/white"
                android:textSize="18sp"
                android:textStyle="bold"
                app:layout_constraintBottom_toTopOf="@+id/tvVipPeriod"
                app:layout_constraintEnd_toStartOf="@+id/ivVipSmall"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintHorizontal_chainStyle="packed"
                app:layout_constraintStart_toEndOf="@+id/img_avatar"
                app:layout_constraintTop_toTopOf="@id/img_avatar"
                app:layout_constraintVertical_chainStyle="spread"
                app:layout_constraintWidth_default="wrap"
                tools:text="@string/sign_in" />

            <ImageView
                android:id="@+id/ivVipSmall"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_marginStart="8dp"            
                app:layout_constraintBottom_toBottomOf="@+id/tv_user_name"
                app:layout_constraintEnd_toStartOf="@+id/tvVipSmall"
                app:layout_constraintStart_toEndOf="@+id/tv_user_name"
                app:layout_constraintTop_toTopOf="@+id/tv_user_name" />

            <TextView
                android:id="@+id/tvVipSmall"
                android:layout_width="wrap_content"
                android:layout_height="11dp"
                android:layout_gravity="bottom"
                android:layout_marginBottom="2dp"
                android:enabled="false"
                android:gravity="center"
                android:text="@string/vip"
                android:textSize="8sp"
                app:layout_constraintBottom_toBottomOf="@id/ivVipSmall"
                app:layout_constraintEnd_toStartOf="@+id/img_vip"
                app:layout_constraintStart_toEndOf="@+id/ivVipSmall" />

            <ImageView
                android:id="@+id/img_vip"
                android:layout_width="86dp"
                android:layout_height="86dp"
                android:layout_marginTop="52dp"
                android:layout_marginEnd="15dp"
                android:visibility="invisible"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                tools:visibility="visible" />
       
        </androidx.constraintlayout.widget.ConstraintLayout>
上一篇下一篇

猜你喜欢

热点阅读