当前位置:代码狗 > 开发教程 > Android开发教程 > 正文

安卓RecyclerView多item布局的实现过程

自从Android引入RecyclerView后,很多想listview这种控件就被开发者逐步放弃。原因是RecyclerView太灵活,太强大了。所以学好RecyclerView能让你写出更牛逼的安卓APP,今天讲下安卓RecyclerView多item布局的实现过程,看下面教程。

安卓RecyclerView多item布局的实现过程

安卓RecyclerView多item布局的实现过程

上图的布局是一个RecyclerView,里面有两种item,一种是轮播图banner,一种是普通的文章列表,两种item就需要准备两个item的布局文件,这里我就不贴布局文件的代码了,大家自己写吧,主要看看RecyclerView的适配器写法。

多item布局核心是通过getItemViewType方法的item序号来判断使用什么类型的布局。

@Override
public int getItemViewType(int position) {
    if(position==0){
        return 1;
    }else{
        return  0;
    }
}

我这里就两种类型。

然后通过onCreateViewHolder方法创建不同的布局,这里的viewType就是上面的getItemViewType方法返回的值。

@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

    if(viewType==1){
        return new bannerHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.banner_layout, parent, false));

    }else {
        return new singleHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.single_item, parent, false));
    }
}

然后在onBindViewHolder方法中,设置控件内容。

@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
    if(holder instanceof bannerHolder){
        //设置banner样式
        ((bannerHolder) holder).mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR);
        //设置图片加载器
        ((bannerHolder) holder).mBanner.setImageLoader(new GlideImageLoader());
        //设置图片集合
        ((bannerHolder) holder).mBanner.setImages(imageArray);
        //设置banner动画效果
        ((bannerHolder) holder).mBanner.setBannerAnimation(Transformer.DepthPage);
        //设置自动轮播,默认为true
        ((bannerHolder) holder).mBanner.isAutoPlay(true);
        //设置轮播时间
        ((bannerHolder) holder).mBanner.setDelayTime(3000);
        //设置指示器位置(当banner模式中有指示器时)
        ((bannerHolder) holder).mBanner.setIndicatorGravity(BannerConfig.RIGHT);
        //banner设置方法全部调用完毕时最后调用
        ((bannerHolder) holder).mBanner.start();
    }else{
        ((singleHolder) holder).mTvTitle.setText(mDataList.get(position).getTitle());
        ((singleHolder) holder).mDesc.setText(mDataList.get(position).getDescription());
        ((singleHolder) holder).mdate.setText(mDataList.get(position).getDatetime());
    }

}

完整的适配器代码如下:

public class MyAdapter  extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

    private List<single_list> mDataList;
    private List<String> imageArray;

    public MyAdapter(List<single_list> list, List<String> imagelist) {
        mDataList = list;
        imageArray=imagelist;
    }

    @Override
    public int getItemCount() {
        // 返回数据集合大小
        return mDataList == null ? 0 : mDataList.size();
    }


    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        if(holder instanceof bannerHolder){


            //设置banner样式
            ((bannerHolder) holder).mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR);
            //设置图片加载器
            ((bannerHolder) holder).mBanner.setImageLoader(new GlideImageLoader());
            //设置图片集合
            ((bannerHolder) holder).mBanner.setImages(imageArray);
            //设置banner动画效果
            ((bannerHolder) holder).mBanner.setBannerAnimation(Transformer.DepthPage);
            //设置自动轮播,默认为true
            ((bannerHolder) holder).mBanner.isAutoPlay(true);
            //设置轮播时间
            ((bannerHolder) holder).mBanner.setDelayTime(3000);
            //设置指示器位置(当banner模式中有指示器时)
            ((bannerHolder) holder).mBanner.setIndicatorGravity(BannerConfig.RIGHT);
            //banner设置方法全部调用完毕时最后调用
            ((bannerHolder) holder).mBanner.start();
        }else{
            ((singleHolder) holder).mTvTitle.setText(mDataList.get(position).getTitle());
            ((singleHolder) holder).mDesc.setText(mDataList.get(position).getDescription());
            ((singleHolder) holder).mdate.setText(mDataList.get(position).getDatetime());
        }


    }

    @Override
    public int getItemViewType(int position) {
        if(position==0){
            return 1;
        }else{
            return  0;
        }
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        if(viewType==1){
            return new bannerHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.banner_layout, parent, false));

        }else {
            return new singleHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.single_item, parent, false));
        }
    }


    public class singleHolder extends RecyclerView.ViewHolder {

        private TextView mTvTitle,mDesc,mdate;

        public singleHolder(View itemView) {
            super(itemView);
            mTvTitle = (TextView) itemView.findViewById(R.id.title);
            mDesc = (TextView) itemView.findViewById(R.id.desc);
            mdate = (TextView) itemView.findViewById(R.id.single_date);
        }


    }
    public class bannerHolder extends RecyclerView.ViewHolder{
        private Banner mBanner;
        public bannerHolder(View itemView) {
            super(itemView);
            mBanner = (Banner)itemView.findViewById(R.id.banner);

        }
    }
}

这里面使用的轮播图是现成的框架,使用非常简单,有需要请看这里:Android图片轮播控件框架banner

我只是简单举了个例子,有需要可以在此基础上扩展,实现更加复杂的布局。

感觉很棒!可以赞赏支持我哟~

赞(3) 打赏

评论 1

  1. #1

    写的很好,支持一下

    死神有欧气2个月前 (07-26)回复
×

请作者吃根烤肠!

支付宝