Android实例精讲——通过ListView构造微信聊天界面视图

我们来通过自定义ListView的Adapter，来创建一个类似的微信聊天界面视图

实现效果如下

通过对效果图的分析，我们可以看到，需要一个视图ImageView作为头像，一个TextView作为名字，一个TextView作为对话。

下面，我们就创建这样的一个布局，在layout这个文件夹中，创建chat_list_view.xml作为聊天视图的布局。
要注意的是，这个布局是ListView每一个条目中的布局，即下图所示的布局

下面，我们来看看chat_list_view.xml中的代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:layout_marginLeft="9dp"
        android:layout_marginStart="9dp"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:id="@+id/heroFaceImage" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="7dp"
        android:layout_marginStart="7dp"
        android:layout_above="@+id/chatContent"
        android:layout_toRightOf="@+id/heroFaceImage"
        android:layout_toEndOf="@+id/heroFaceImage"
        android:text="heroName"
        android:id="@+id/heroName"
        android:textSize="12sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="9dp"
        android:layout_alignBottom="@+id/heroFaceImage"
        android:layout_alignLeft="@+id/heroName"
        android:layout_alignSt