对齐 TextView 基线和另一个 TextView 底部

Question

我有 RelativeLayout 和两个 TextView，其中一个有背景。

图像上两条基线对齐，但我想对齐其中一条的基线和另一条的背景底部。

这是我的 xml 代码。

<RelativeLayout
    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="@dimen/chat_room_item_height"
    android:background="?attr/selectableItemBackground"
    android:paddingEnd="16dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingStart="16dp"
    >

    <!-- other stuff -->

    <TextView
        android:id="@+id/text_view_unread_message_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/text_view_last_message_date"
        android:layout_marginLeft="8dp"
        android:layout_marginStart="8dp"
        android:background="@drawable/chat_unread_message_count_background"
        style="@style/ChatRoomUnreadMessageCountTextStyle"
        tools:text="101"
        />

  <TextView
      android:id="@+id/text_view_last_message"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_below="@+id/text_view_title"
      android:layout_toEndOf="@id/image_view_icon"
      android:layout_toLeftOf="@id/text_view_unread_message_count"
      android:layout_toRightOf="@id/image_view_icon"
      android:layout_toStartOf="@id/text_view_unread_message_count"
      android:ellipsize="end"
      android:layout_alignBaseline="@+id/text_view_unread_message_count"
      android:gravity="bottom"
      android:maxLines="1"
      tools:text="My life is a story book with many different chapters but I don’t let everyone read it."
      style="@style/ChatRoomLastMessageTextStyle"
      />

</RelativeLayout>

我试过将带背景的 TextView 包装到不同的 ViewGrop，将两个 TextView 包装到布局，但无济于事。

Answer 1

你可以玩点小把戏，我们开始吧：

将 text_view_unread_message_count 放在某个视图组中，例如RelativeLayout 并使用 SP 缩放添加 paddingBottom（这是您的 space 用于手动对齐），如下所示：

Obs.: 您需要为您的 TextView 提供一个新 ID，这是一个可以更改 ID 和大小值的示例。

   <!-- sp scaling will change with font size -->
    <RelativeLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:paddingBottom="10sp"
        android:layout_marginLeft="8dp"
        android:layout_marginStart="8dp"
        android:layout_toEndOf="@id/image_view_icon"
        android:layout_toLeftOf="@id/text_view_unread_message_count"
        android:layout_toRightOf="@id/image_view_icon"
        android:layout_toStartOf="@id/text_view_unread_message_count">
        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/chat_unread_message_count_background"
                style="@style/ChatRoomUnreadMessageCountTextStyle"
                tools:text="101"
        />
    </RelativeLayout>

将您的位置定义放在父级上，将文本定义放在 textview 上。这应该有效。

Answer 2

您可以通过编程方式设置所需的底部边距。

val bottomToBaselineHeight = textViewLastMessage.height - textViewLastMessage.baseline
textViewUnreadMessageCount.margin(bottom = bottomToBaselineHeight)

对齐 TextView 基线和另一个 TextView 底部

Align TextView baseline and another TextView bottom

android

alignment

baseline

textview