在RecyclerView里使用图片轮播

xiaoxiao2021-03-26 50

前段时间学习了基于RecyclerView的MultiType框架，最近在做项目的时候碰到需要在RecyclerView里使用图片轮播的功能，所以我就准备在项目中将图片轮播和MultiType框架结合使用。为了加深印象，特将项目中的一些代码记录下来，以便以后翻阅查询。

网上的图片轮播代码不计其数，作为懒到极致的我来说自然是找个容易上手的框架更为实际。在此我用的是github上大神的框架, 这里放上作者的github地址：https://github.com/youth5201314/banner 感谢大神的无私奉献。对于新手的我来说该框架出奇的好用，特别适合初学者和像我这样的新手。

作者的github页面是这样介绍这款框架的： - Android广告图片轮播控件，支持无限循环和多种主题，可以灵活设置轮播样式、动画、轮播和切换时间、位置、图片加载框架等！

在我粗略翻阅了一遍之后便对该框架的使用有了初步的了解，上手起来也特别容易。以下是我结合MultiType框架开发的步骤： 1、在项目的build.gradle中添加以下依赖：

//picasso 图片加载框架 compile 'it.sephiroth.android.library.picasso:picasso:2.5.2.4b' //multytype框架 compile 'me.drakeet.multitype:multitype:2.4.1' //图片轮播控件 compile 'com.youth.banner:banner:1.4.8'

2、将以下布局添加到布局文件中

<com.youth.banner.Banner  xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/banner_fragment_first_pic_loop" android:layout_width="match_parent" android:layout_height="180dp"/>

注：该布局可以单独作为一个布局文件，也可以添加到ViewGroup中

3、自定义一个图片加载器类继承ImageLoader，并重写displayImage方法，如下所示：

/** * 图片加载器 */ public class PicLoopImageLoader extends ImageLoader { @Override public void displayImage(Context context, Object path, ImageView imageView) { Picasso.with(context).load((String) path).into(imageView); //图片加载也可以用Glide的框架 //Glide.with(context).load((String)path).into(imageView); } }

4、在ViewProvider里的ViewHolder里定义一个banner对象

class PicLoopViewHolder extends RecyclerView.ViewHolder { Banner banner; public PicLoopViewHolder(Banner banner) { super(banner); this.banner = banner; } }

5、随后在onCreateViewHolder方法里找到包含Banner的布局文件

@NonNull @Override protected PicLoopViewHolder onCreateViewHolder(@NonNull LayoutInflater inflater, @NonNull ViewGroup parent) { Banner banner = (Banner) inflater.inflate(R.layout.fragment_first_pic_loop, parent, false); return new PicLoopViewHolder(banner); }

在该项目中我是将Banner的布局单独作为一个布局文件，因此上述代码直接找到的是Banner控件对象，将Banner对象直接传给ViewHolder

6、在onBindViewHolder里使用ViewHolder中的banner对象

holder.banner.setImageLoader(new PicLoopImageLoader()) //设置banner的样式 .setBannerStyle(BannerConfig.CIRCLE_INDICATOR) //这里传的是图片的地址集合 .setImages(picLoop.getImageList()) .setDelayTime(2500) //设置图片轮播的间隔 .setIndicatorGravity(BannerConfig.RIGHT) .start();

查看BannerConfig的源码可知有以下几种样式可供选择：

BannerConfig.NOT_INDICATOR=0; BannerConfig.CIRCLE_INDICATOR=1; BannerConfig.NUM_INDICATOR=2; BannerConfig.NUM_INDICATOR_TITLE=3; BannerConfig.CIRCLE_INDICATOR_TITLE=4; BannerConfig.CIRCLE_INDICATOR_TITLE_INSIDE=5;

7、在Activity或Fragment里设置RecyclerView，LayoutManager，adapter等，具体步骤查找MultiType部分的代码

放上图片轮播部分的截图：

转载请注明原文地址: https://ju.6miu.com/read-658873.html

技术

最新回复(0)

在RecyclerView里使用图片轮播

图片轮播控件Banner，结合MultiType框架使用

技术