安卓Listview如何像Whatsapp聊天应用一样显示。

Question

大家好，我需要开发类似于Whatsapp聊天屏幕的布局，如下所示：

在这个布局中，我希望在聊天文本视图完成后显示时间。

为此，我已经完成了以下工作：

<RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/blue" >

                <TextView
                    android:id="@+id/tv_message_chat_item_f"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="2dp"
                    android:layout_marginTop="2dp"
                    android:gravity="left|center"

                    android:paddingBottom="@dimen/one_dp"
                    android:paddingLeft="@dimen/fifteen_dp"
                    android:paddingRight="@dimen/five_dp"
                    android:paddingTop="@dimen/one_dp"
                      android:textAppearance="?android:attr/textAppearanceMedium"
                    android:text="fgfdgdf rete tretretret rtrtrwtw fgdfr grtwerwerewr ewrwerew" />

                <TextView
                    android:id="@+id/tv_message_time_f"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_below="@+id/tv_message_chat_item_f"
                    android:layout_marginBottom="2dp"
                   android:paddingRight="@dimen/five_dp"
                    android:gravity="right"
                    android:paddingBottom="@dimen/one_dp"
                    android:text="fgfdg"
                    android:textAppearance="?android:attr/textAppearanceSmall" />



            </RelativeLayout>

但无法处理大量消息（时间文本视图未正确设置）

- Android

---

使用gravity属性向右对齐，或者将Framelayout作为父布局，然后将位置属性设置为始终向右。 - Tushar Pandey

我已经使用了类似于查看编辑队列的功能。但是我需要它像精确的屏幕截图一样，当有小消息时，相对布局必须与屏幕截图的宽度完全相同。 - Android

请发送简短消息“你好”，再发送三四行的消息，以查看不同之处。 - Android

@Android 你有没有针对这种类型的ListView的解决方案？ - CoronaPintu

抱歉，我找不到。我们稍微改变了设计。如果您找到任何解决方案，请告诉我。 - Android

Answer 1

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:gravity="bottom"
        android:background="@drawable/blue"
        android:layout_alignParentStart="true" android:weightSum="10">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Hi"
            android:layout_weight="1"
            android:id="@+id/textView"
            android:gravity="bottom"
            android:layout_centerVertical="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="bottom"
            android:layout_marginStart="10dp"
            android:text="Small Text"
            android:textAppearance="?android:attr/textAppearanceSmall" />

    </LinearLayout>

- Android

Answer 2

假设您的textView3是带有“大消息”的那个，您应该首先利用相对布局功能，并使用android:layout_below="@id/textview2"，这将防止与textView2重叠，而不仅仅是从底部向上对齐所有内容。

  <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/textView2"
                android:layout_centerHorizontal="true"
                android:text="Small Text"
                android:textAppearance="?android:attr/textAppearanceSmall" />

然后在设置好用来显示“时间”的 TextView 之后，您可以再次使用类似于以下的方法：

   <TextView
                    android:id="@+id/textView3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/textView2"
                    android:gravity="right"
                    android:layout_alignParentRight="true"
                    android:text="12:00 pm"
                    android:textAppearance="?android:attr/textAppearanceSmall" />

Gravity right 可以让文本从右到左排列，因为显示时间通常不需要超过6或7个字符，这将有所帮助。

希望能解决您的问题。

- Joel

Answer 3

您需要使用9patches来实现ImageViews（这里是链接：link）。 还需要一个能够处理ListItems的CustomLayouts的ListView（带有9Patch ImageView）。

我认为您能够实现一个ListView，因此我在这里不再深入讨论。 问候。

- JacksOnF1re