Recyclerview 實現多條目載入
阿新 • • 發佈:2019-01-07
這種佈局樣式,相信很多開發者都會用到
今天我是用RecyclerView來實現這個多種Item的載入.
其實最關鍵的是要複寫RecyclerView的Adapter中的getItemViewType()方法
這個方法就根據條件返回條目的型別
一般有多少種類型我們就定義多少種常量
//定義兩種常量 表示兩種條目型別
public static final int TYPE_LEFT_IMAGE = 0;
public static final int TYPE_RIGHT_IMAGE = 1;
其實就是從activity中傳到adapter中的資料中必須要有一個type欄位來判斷這個item物件需要那種檢視,然後return出一個標記,在onCreateViewHolder中在引用所對應的item佈局.
/**
* 獲取不同的條目型別
*
* @param position
* @return
*/
@Override
public int getItemViewType(int position) {
String imgUrls = list.get(position).getImgUrls();
if (imgUrls == null || imgUrls.isEmpty()) {
return TYPE_LEFT_IMAGE;
} else {
return TYPE_RIGHT_IMAGE;
}
}
有了定義的常量之後 在onCreateViewHolder里根據viewtype來判斷 所引用的item佈局型別 這樣每一條item就會不一樣了
/**
* 建立viewholder
*
* @param parent
* @param viewType
* @return
*/
@NonNull
@Override
public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = null;
RecyclerView.ViewHolder holder = null;
switch (viewType) {
case TYPE_LEFT_IMAGE:
//條目佈局
view = LayoutInflater.from(context).inflate(R.layout.recyclerview_item, null);
holder = new TextViewHolder(view);
break;
case TYPE_RIGHT_IMAGE:
view = LayoutInflater.from(context).inflate(R.layout.recyclerview_item2, null);
holder = new ImageViewHolder(view);
break;
}
return holder;
}
建立不同的佈局
//只有文字的佈局
private class TextViewHolder extends RecyclerView.ViewHolder {
public TextView mCrossetalk;
public TextViewHolder(View itemView) {
super(itemView);
mCrossetalk = itemView.findViewById(R.id.crossetalk);
}
}
//圖文並茂的佈局
private class ImageViewHolder extends RecyclerView.ViewHolder {
public ImageView crossetalk_pic;
public TextView crossetalk2;
public ImageViewHolder(View itemView) {
super(itemView);
crossetalk2 = itemView.findViewById(R.id.crossetalk2);
crossetalk_pic = itemView.findViewById(R.id.crossetalk_pic);
}
}
好了,關鍵點就這麼多,這是一個完整的adapter
/**
* Author:AND
* Time: 2018/4/1.
* Email:[email protected]
* Description: recyclerview多條目載入
* Detail:又一次實踐,從未有的體驗
*/
public class CrosseTalkAdapter extends RecyclerView.Adapter {
//定義兩種常量 表示兩種條目型別
public static final int TYPE_LEFT_IMAGE = 0;
public static final int TYPE_RIGHT_IMAGE = 1;
private List<CrosseTalkBean.DataBean> list;
private Context context;
public CrosseTalkAdapter(List<CrosseTalkBean.DataBean> list, Context context) {
this.list = list;
this.context = context;
}
/**
* 建立viewholder
*
* @param parent
* @param viewType
* @return
*/
@NonNull
@Override
public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = null;
RecyclerView.ViewHolder holder = null;
switch (viewType) {
case TYPE_LEFT_IMAGE:
//條目佈局
view = LayoutInflater.from(context).inflate(R.layout.recyclerview_item, null);
holder = new TextViewHolder(view);
break;
case TYPE_RIGHT_IMAGE:
view = LayoutInflater.from(context).inflate(R.layout.recyclerview_item2, null);
holder = new ImageViewHolder(view);
break;
}
return holder;
}
/**
* 繫結資料
*
* @param holder
* @param position
*/
@Override
public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
CrosseTalkBean.DataBean dataBean = list.get(position);
if (holder instanceof TextViewHolder) {
((TextViewHolder) holder).mCrossetalk.setText(dataBean.getCreateTime());
}
//在裡面設定各自的介面卡 和顯示的佈局
if (holder instanceof ImageViewHolder) {
((ImageViewHolder) holder).crossetalk2.setText(dataBean.getCreateTime());
String imgUrls = dataBean.getImgUrls();
String[] split = imgUrls.split("\\|");
Glide.with(context).load(split[0]).into(((ImageViewHolder) holder).crossetalk_pic);
}
}
/**
* 條目數量
*
* @return
*/
@Override
public int getItemCount() {
return list.size();
}
/**
* 獲取不同的條目型別
*
* @param position
* @return
*/
@Override
public int getItemViewType(int position) {
String imgUrls = list.get(position).getImgUrls();
if (imgUrls == null || imgUrls.isEmpty()) {
return TYPE_LEFT_IMAGE;
} else {
return TYPE_RIGHT_IMAGE;
}
}
private class TextViewHolder extends RecyclerView.ViewHolder {
public TextView mCrossetalk;
public TextViewHolder(View itemView) {
super(itemView);
mCrossetalk = itemView.findViewById(R.id.crossetalk);
}
}
private class ImageViewHolder extends RecyclerView.ViewHolder {
public ImageView crossetalk_pic;
public TextView crossetalk2;
public ImageViewHolder(View itemView) {
super(itemView);
crossetalk2 = itemView.findViewById(R.id.crossetalk2);
crossetalk_pic = itemView.findViewById(R.id.crossetalk_pic);
}
}
}