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));
//设置Adapter
recyclerView.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) {
//设置对应的数据
}
}