alignParentRight 使布局采用 parent 的宽度，尽管在聊天气泡中 'wrap content'

Question

我正在尝试创建这样的聊天气泡 -

但我希望这个气泡包裹它的内容。现在的问题是，每当我尝试对那些 'double-ticks' 使用“alignparentRight = true”时，它都会扩展到视图以占据整个 parents 宽度。

我怎样才能将其内容包装起来，使刻度保持在右下角，文本 'hero' 保持在左上角。

<RelativeLayout
    android:id="@+id/wrapper"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:background="@drawable/bubble_send"
    android:gravity="right"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/chat_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/chat_comment"
        android:src="@drawable/rotate"
        android:visibility="visible"/>


    <TextView
        android:id="@+id/chat_comment"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/time"
        android:maxWidth="200dp"
        android:text="Hero"
        android:textColor="@android:color/primary_text_light"/>


    <TextView
        android:id="@+id/time"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/tick"

        android:layout_toLeftOf="@id/tick"
        android:text="11:25 am"
        android:textColor="@color/black"
        android:textSize="10sp"/>

    <ImageView
        android:id="@+id/tick"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/chat_comment"
        android:layout_marginTop="5dp"
        android:src="@drawable/ic_tick_double"
        android:visibility="visible"/>
</RelativeLayout>

Answer 1

我想避免多重嵌套，但这是唯一的办法。 -

<LinearLayout
    android:id="@+id/wrapper"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/bubble_send"
    android:minWidth="100dp"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/chat_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/chat_comment"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/rotate"
        android:visibility="gone"/>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:layout_margin="5dp"
        android:orientation="vertical">

        <TextView
            android:id="@+id/chat_comment"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@+id/time"
            android:maxWidth="200dp"
            android:text="Hero"
            android:textColor="@android:color/primary_text_light"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right">

        <TextView
            android:id="@+id/time"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_toLeftOf="@id/tick"
            android:text="11:25 am"
            android:textColor="@color/black"
            android:textSize="10sp"/>

        <ImageView
            android:id="@+id/tick"
            android:layout_width="15dp"
            android:layout_height="15dp"
            android:layout_alignParentRight="true"
            android:layout_marginTop="5dp"
            android:src="@drawable/ic_tick_double"
            android:visibility="visible"/>
    </LinearLayout>
</LinearLayout>

Answer 2

<RelativeLayout
android:id="@+id/wrapper"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@drawable/bubble_send"
android:gravity="right"
android:orientation="vertical">

<ImageView
    android:id="@+id/chat_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/chat_comment"
    android:src="@drawable/rotate"
    android:visibility="visible"/>


<TextView
    android:id="@+id/chat_comment"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@+id/time"
    android:maxWidth="200dp"
    android:text="Hero"
    android:textColor="@android:color/primary_text_light"/>


<TextView
    android:id="@+id/time"
    android:layout_width="50dp"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/tick"

    android:layout_toLeftOf="@id/tick"
    android:text="11:25 am"
    android:textColor="@color/black"
    android:textSize="10sp"/>

<ImageView
    android:id="@+id/tick"
    android:layout_width="15dp"
    android:layout_height="15dp"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/chat_comment"
    android:layout_marginTop="5dp"
    android:src="@drawable/ic_tick_double"
    android:visibility="visible"/>

-与其让你的主布局来包装内容，不如把它设置为固定宽度

alignParentRight 使布局采用 parent 的宽度，尽管在聊天气泡中 'wrap content'

alignParentRight make the layout take parent's width despite being 'wrap content' in chat bubble

layout

android