Question

我正在尝试为聊天页面创建一个带有气泡的Android平台聊天应用程序。

我通过使用LinearLayout成功地为对话的右侧制作了气泡，当Message TextView有多行时，它会在不将状态TextView推出屏幕的情况下进行换行。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:baselineAligned="false"
    android:gravity="right"
    android:orientation="horizontal" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="0"
        android:gravity="bottom|right"
        android:orientation="vertical"
        android:paddingLeft="5dip" >

        <TextView
            android:id="@+id/status"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/bubble_status"
            android:textColor="#5D5958"
            android:textSize="9sp" />

        <TextView
            android:id="@+id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:singleLine="true"
            android:text="@string/bubble_time"
            android:textColor="#5D5958"
            android:textSize="9sp" />
    </LinearLayout>

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_tosca"
        android:gravity="center|left"
        android:paddingLeft="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/white"
        android:textSize="15sp" />

</LinearLayout>

但是，当我构建对话的左侧时，会出现另一种情况首先，我使用相同的LinearLayout，但只是从右向左切换侧面和重力，但它不起作用。
消息TextView将状态推出屏幕所以我通过使用RelativeLayout改变了它这仅适用于短文本，因为TextView没有换行，但是当我在其中放入一个长文本时，它将换行并将状态TextView推出屏幕。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_odd_grey"
        android:gravity="center|left"
        android:paddingRight="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/black"
        android:textSize="15sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_alignBottom="@id/bubble"
        android:layout_toRightOf="@id/bubble"
        android:text="@string/bubble_time"
        android:textColor="#5D5958"
        android:textSize="9sp" />

</RelativeLayout>

你能帮帮我吗？

Answer 1

最后，在与朋友讨论后，我找到了答案。所以这里的预期代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:gravity="left">

    <TextView
        android:id="@+id/bubble"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/time"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_odd_grey"
        android:gravity="center|left"
        android:paddingRight="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/black"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_toLeftOf="@+id/fakeLayout"
        android:layout_alignBottom="@+id/bubble"
        android:text="@string/bubble_time"
        android:textColor="#5D5958"
        android:textSize="9sp" />

    <FrameLayout
        android:id="@+id/fakeLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:visibility="invisible" >
    </FrameLayout>

</RelativeLayout>

由于

Answer 2

试试这样：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/bubble"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/bubble2"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:background="@drawable/bubble_odd_grey"
        android:gravity="center|left"
        android:paddingRight="10dip"
        android:text="@string/bubble_content"
        android:textColor="@android:color/black"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/bubble2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_alignParentRight="true"
        android:layout_alignBottom="@+id/bubble"
        android:text="@string/bubble_time"
        android:textColor="#5D5958"
        android:textSize="9sp" />

</RelativeLayout>

这是截图：
enter image description here

Android Layout，限制RelativeLayout子项的宽度

2 个答案: