Recyclerview 实现多条目加载

这种布局样式,相信很多开发者都会用到
今天我是用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:2911743255@qq.com
 * 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);
        }
    }
}