解決ConstraintLayout約束佈局一行顯示多個textView內容疊加問題

參考:https://blog.csdn.net/murongbingxiao/article/details/78414248?utm_source=blogxgwz7

爲了提升效率,佈局時使用ConstraintLayout約束佈局,遇到問題:一行有多個文本TextView時,TextView內容疊加顯示。

處理前與處理後效果對比:

注意:標題work_record_project_name與work_record_username顯示時會出現不處理或處理不正確時,容易出現疊加顯示問題。

處理方式:

<TextView
    android:id="@+id/work_record_project_name"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginLeft="@dimen/padding"
    android:text="xxx"
    android:textColor="@color/text_normal"
    android:textSize="@dimen/text_size_large"
    app:layout_constraintLeft_toRightOf="@id/work_record_img"
    app:layout_constraintRight_toLeftOf="@id/work_record_username"
    app:layout_constraintTop_toTopOf="@id/work_record_img" />

(1)、TextView設置寬度爲0: android:layout_width="0dp", 必須指定寬度爲0,使得第一個textview自適應

(2)、設置佈局約束條件:需要同時指定左側和右側鏈

app:layout_constraintLeft_toRightOf="@id/work_record_img" app:layout_constraintRight_toLeftOf="@id/work_record_username"

<?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="match_parent"
    android:padding="@dimen/padding"
    tools:context=".activity.WorkRecordListActivity">

    <ImageView
        android:id="@+id/work_record_img"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_work_record"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/work_record_project_name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/padding"
        android:text="解決ConstraintLayout佈局一行顯示多個textView內容疊加問題解決ConstraintLayout佈局一行顯示多個textView內容疊加問題"
        android:textColor="@color/text_normal"
        android:textSize="@dimen/text_size_large"
        app:layout_constraintLeft_toRightOf="@id/work_record_img"
        app:layout_constraintRight_toLeftOf="@id/work_record_username"
        app:layout_constraintTop_toTopOf="@id/work_record_img" />

    <TextView
        android:id="@+id/work_record_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/padding"
        android:layout_marginTop="@dimen/padding"
        android:text="2020-02-23"
        android:textColor="@color/text_color_gray"
        android:textSize="@dimen/text_size_big"
        app:layout_constraintLeft_toRightOf="@id/work_record_img"
        app:layout_constraintTop_toBottomOf="@id/work_record_project_name" />

    <TextView
        android:id="@+id/work_record_use_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/padding"
        android:layout_marginTop="@dimen/padding"
        android:text="3.5小時"
        android:textColor="@color/text_color_gray"
        android:textSize="@dimen/text_size_big"
        app:layout_constraintLeft_toRightOf="@id/work_record_date"
        app:layout_constraintTop_toBottomOf="@id/work_record_project_name" />

    <TextView
        android:id="@+id/work_record_username"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="@dimen/padding"
        android:text="test1"
        android:textColor="@color/text_normal"
        android:textSize="@dimen/text_size_large"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@id/work_record_project_name" />

    <!--計劃相關佈局-->
    <RelativeLayout
        android:id="@+id/work_plan"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/padding"
        android:layout_marginRight="@dimen/padding"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/work_record_username">

        <ImageView
            android:id="@+id/work_plan_icon"
            android:layout_width="18dp"
            android:layout_height="18dp"
            android:src="@mipmap/ic_work_plan" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_marginLeft="@dimen/margin_2"
            android:layout_toRightOf="@id/work_plan_icon"
            android:text="計劃"
            android:textColor="@color/text_color_gray"
            android:textSize="@dimen/text_size_big" />
    </RelativeLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

 

 

 

 

 

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章