如何在材料设计上创建类似whatsapp的聊天屏幕

Question

基本上，我对每个聊天条目的xml文件感到困惑，其中的内容包装如whatsapp。我试过使用framelayout和Relativelayout，但它不起作用。消息没有围绕时间进行包装。

 <FrameLayout
        android:id="@+id/chat_mine"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:background="@drawable/chat_bg_white"
       >

        <TextView
            android:id="@+id/chat_text_mine"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="65dp"
            android:gravity="center|left"
            android:text="h"
            android:textSize="@dimen/font_size3" />
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            >
            <TextView
                android:id="@+id/chat_time_mine"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right|bottom"
                 android:gravity="right|bottom"
                android:singleLine="true"
                android:text=" 2:00 am"
                android:textSize="@dimen/font_size4" />
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_delivered" />
        </LinearLayout>
    </FrameLayout>

Answer 1

不确定你在这里想问什么?如果我理解正确，编辑你的框架布局，首先显示一些东西。这将帮助您在预览中看到内容。

<FrameLayout
    android:id="@+id/chat_mine"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="right"
    android:background="@drawable/chat_bg_white"
   >