Android布局问题：两行TextView布局及ImageView+TextView靠右布局异常排查

一、两行右对齐TextView布局 #

这个布局实现起来很简单，用LinearLayout或者ConstraintLayout都能轻松搞定：

方案1：LinearLayout实现 #

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:gravity="end">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一行右对齐文本"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第二行右对齐文本"/>

</LinearLayout>

方案2：ConstraintLayout实现 #

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

    <TextView
        android:id="@+id/tv_line1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一行右对齐文本"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <TextView
        android:id="@+id/tv_line2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第二行右对齐文本"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@id/tv_line1"/>

</androidx.constraintlayout.widget.ConstraintLayout>

二、左图+两行左对齐文本+右侧TextView布局（修复重叠问题） #

你之前遇到的覆盖问题，核心原因是用toRightOf时没给左侧文本区域设置合理的宽度约束，导致右侧TextView和左侧文本区域重叠。下面分享两种靠谱的实现方式：

方案1：ConstraintLayout（推荐，更灵活） #

这种方式能精准控制每个View的位置，彻底避免重叠：

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="16dp">

    <!-- 左侧ImageView -->
    <ImageView
        android:id="@+id/iv_icon"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:src="@drawable/ic_launcher_foreground"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <!-- 左侧两行TextView的容器 -->
    <LinearLayout
        android:id="@+id/layout_left_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_marginStart="12dp"
        app:layout_constraintStart_toEndOf="@id/iv_icon"
        app:layout_constraintEnd_toStartOf="@id/tv_right"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="第一行左对齐文本"
            android:textSize="16sp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="第二行左对齐文本"
            android:textSize="14sp"
            android:textColor="@android:color/darker_gray"
            android:layout_marginTop="4dp"/>

    </LinearLayout>

    <!-- 右侧TextView -->
    <TextView
        android:id="@+id/tv_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右侧文本"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

关键说明：

• 左侧文本容器layout_left_text设置layout_width="0dp"，同时用constraintStart和constraintEnd分别绑定到ImageView和右侧TextView，这样它会自动占据中间的可用空间，不会和右侧TextView抢位置。
• 右侧TextView通过constraintEnd_toEndOf="parent"固定在父布局右端，同时和左侧容器的end约束关联，确保间距合理。

方案2：LinearLayout实现 #

如果习惯用LinearLayout，也可以通过权重分配来实现：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="16dp"
    android:gravity="center_vertical">

    <ImageView
        android:id="@+id/iv_icon"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:src="@drawable/ic_launcher_foreground"/>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:layout_marginStart="12dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="第一行左对齐文本"
            android:textSize="16sp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="第二行左对齐文本"
            android:textSize="14sp"
            android:textColor="@android:color/darker_gray"
            android:layout_marginTop="4dp"/>

    </LinearLayout>

    <TextView
        android:id="@+id/tv_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="右侧文本"
        android:textSize="14sp"/>

</LinearLayout>

关键说明：

• 左侧文本容器设置layout_weight="1"和layout_width="0dp"，让它占据除了ImageView和右侧TextView之外的所有空间，这样右侧TextView自然会被挤到最右端，不会出现重叠。

内容的提问来源于stack exchange，提问作者Darksymphony