RecyclerView（三）实现聊天窗口样式（Android 5.0 新特性）

Android RecyclerView（三）实现聊天窗口样式（Android 5.0 新特性）

---

效果

    

---

1 聊天窗口子视图布局文件

1.1 左边消息视图布局文件

使用到的背景图片

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical">    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="10dp"        android:minWidth="150dp"        android:orientation="horizontal">        <ImageView            android:layout_width="50dp"            android:layout_height="50dp"            android:layout_marginLeft="10dp"            android:layout_marginRight="10dp"            android:src="@drawable/item_title_left" />        <TextView            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_marginBottom="10dp"            android:layout_marginRight="10dp"            android:layout_marginTop="10dp"            android:layout_weight="1"            android:background="@drawable/qq_item_left"            android:maxWidth="200dp"            android:paddingLeft="24dp"            android:paddingRight="8dp"            android:paddingTop="10dp"            android:text="你好 ？ \n你在吗 3333333333333333333？"            android:textColor="#353434"            android:textSize="14sp" />    </LinearLayout></RelativeLayout>

1.2 右边消息视图布局文件

使用到的背景图片

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="vertical">    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentRight="true"        android:layout_marginTop="10dp"        android:minWidth="150dp"        android:orientation="horizontal">        <TextView            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_weight="1"            android:maxWidth="250dp"            android:paddingBottom="10dp"            android:paddingLeft="10dp"            android:paddingRight="22dp"            android:background="@drawable/qq_item_right"            android:paddingTop="10dp"            android:text="你好 ？ \n你在吗 ？"            android:textColor="#353434"            android:textSize="14sp" />        <ImageView            android:layout_marginLeft="10dp"            android:layout_marginRight="10dp"            android:layout_width="50dp"            android:layout_height="50dp"            android:src="@drawable/item_title_right" />    </LinearLayout></RelativeLayout>

---

2 加载使用RecyclerView

2.1 布局文件

<android.support.v7.widget.RecyclerView    android:background="#FF504F4F"    android:id = "@+id/rv_list"    android:layout_width = "match_parent"    android:layout_height = "match_parent" />

2.2 java代码中设置

RecyclerView recyclerView = (RecyclerView) findViewById(R.id.rv_list);//设置recyclerView.setLayoutManager(new LinearLayoutManager(this));//设置AdapterrecyclerView.setAdapter(mViewHolderAdapter);

2.3 使用到的 Adapter

     在这里会重写RecyclerView.Adapter 的getItemViewType方法，用于指定加载视图的类型
     然后在 onCreateViewHolder 方法中获取到对应的 视图类型viewType，根据viewType的类型来动态的加载不同的布局文件与创建不同的Holder
     最后在onBindViewHolder，通过int itemViewType = this.getItemViewType(position);方法来获取到对应 条目的 条目类型，然后再设置不同的显示数据

private RecyclerView.Adapter<ViewHolder> mViewHolderAdapter = new RecyclerView.Adapter<ViewHolder>() {    @Override    public ViewHolder onCreateViewHolder (ViewGroup parent, int viewType) {        //获取加载条目类型 viewType        // 1 加载左边视图        // 2 加载右边视图        if (viewType==1){            //加载条目布局文件            View view = View.inflate(RecyActivity.this, R.layout.item_left, null);            //创建ViewHolder            LeftViewHolder leftViewHolder = new LeftViewHolder(view);            return leftViewHolder;        }else {            //加载条目布局文件            View view = View.inflate(RecyActivity.this, R.layout.item_right, null);            //创建ViewHolder            RightViewHolder rightViewHolder = new RightViewHolder(view);            return rightViewHolder;        }    }    @Override    public void onBindViewHolder (ViewHolder holder, int position) {        //获取条目类型        // 1 左边视图        // 2 右边视图        int itemViewType = this.getItemViewType(position);        if (itemViewType==1){            //获取Holder            LeftViewHolder viewHolder = (LeftViewHolder) holder;            //设置数据            viewHolder.setDatas(position);        }else {            //获取Holder            RightViewHolder viewHolder = (RightViewHolder) holder;            //设置数据            viewHolder.setDatas(position);        }    }    @Override    public int getItemCount () {        return 50;    }    //返回条目类型    // 返回1 加载左边视图    // 返回2 加载右边视图    @Override    public int getItemViewType (int position) {        position = position%2;        if (position==0){            return 1;        }else {            return 2;        }    }};

2.4 （2.3中的Adapter）使用到的 ViewHolder

private static class LeftViewHolder extends ViewHolder {    public LeftViewHolder (View itemView) {        super(itemView);        //获取相关的控件     }    public void setDatas (int position) {        //设置对应的数据    }}private static class RightViewHolder extends ViewHolder {    public RightViewHolder (View itemView) {        super(itemView);        //获取相关的控件     }    public void setDatas (int position) {//设置对应的数据    }}

---