用RecyclerView打造一个轮播图（进阶版）

前几天写了篇 《用RecyclerView打造一个轮播图》 （以下简称基础版）,看到有读者评论说相比Viewpager，用RecyclerView看起来没什么特别的优势。究其原因，目前只用到了RecyclerView最基础的一部分功能。其实相比Viewpager实现的轮播图，RecyclerView版的最大优势就在于它的灵活多变性，可定制性高。本篇文章将通过利用LayoutManger、SnapHelper等RecyclerView的辅助类来实现一系列更为炫酷的轮播图。

基础版中，RecyclerView设置了默认横向的 LinearLayoutManager :

LinearLayoutManager indicatorLayoutManager = new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false)

那么我们再来加个属性：

同时在布局文件中设置 app:orientation="vertical" ,让 LinearLayoutManager 的布局方向变为竖直（为了保持统一，标示点布局方向跟随滑动方向），就是这么简单，一款竖直滑动的无限轮播图就打造完成了！

之前有篇文章 ViewPager系列之 仿魅族应用的广告BannerView ,不过这是用ViewPager实现的，那我们就来个RecyclerView版的，而实现重点的就在于自定义LayoutManger（如果不太了解这部分的知识，请先移步学习下(╯︵╰)）。

这次先上成果图，再慢慢分析：

以上的效果仅仅是换了一个LayoutManger和一个itemview（为了显示效果，imageview外面套了cardview）。

首先我们做准备工作，定义几个常量：

自定layoutmanager第一步当然是实现唯一必须要实现的方法：

然而并没有什么用，99%的自定义 LayoutManager 都是这么写的，因为我们没有把view添加到 RecyclerView中。所以接下来就是重写 onLayoutChildren() 来进行布局，这个方法的作用相当于普通Viewgroup中的 onLayout() 方法，在RecyclerView滚动，数据改变等情况都会调用此方法来重新布局。

具体的布局方法，主要就是：回收不可见的itemview，遍历可见的itemview进行位置计算并放置：

接下来是处理滚动，让recyclerview可以滚动起来：

因为在我们在布局和滚动时考虑了横向和竖向的情况，所以设置竖直的无限轮播图也很简单：

new BannerLayoutManager(BannerLayoutManager.VERTICAL, Util.dp2px(10))

（方向竖直，图片间距10dp，默认放大1.2倍）

看到这，我想大家都能看到用RecyclerView实现无限轮播图的强大的之处了吧：

adapter可以处理itemview布局和无限轮播； LayoutManager 可以处理整体布局和滑动动画；SnapHelper可以让itemview滑动起来像viewpager一样（一般用自带的 PagerSnapHelper 就行了）。

而上面的所有动画效果仅仅都是通过改动 LayoutManager ，然后再通过设置不同itemview，就可以做出各种不同效果。最后感谢以下文章提供 LayoutManager 的实现思路。

http://blog.csdn.net/zxt0601/article/details/52956504

http://www.jianshu.com/p/7bb7556bbe10

自定义ImageView，是RecyclerView的一个item，滚动显示完整的图片，如下

其实思路也很简单了，展示图片的控件高度很小，而图片高度很大，我们只有滚动的时候才能看到完整图片的不同部分, 我是想到ImageView处理图片的时候也会裁剪啥的，而且也有一种scaleType是Matrix，我们动态修改Matrix不就可以动态处理图片的显示效果了?

如下就是自定义了一个ImageView

用的时候也很简单，设置完图片，然后调用bindRecyclerView（）就ok拉！

简单说下原理，黑框RecyclerView高度，红框是ImageView高度，ImageView可见范围就是RecyclerView的高度，算出这个因子，就知道图片该偏移多少，反正ImageView到顶部的话显示图片的顶部视图，ImageView在底部的话显示图片的底部视图.

目前的效果是滚到顶部的时候图片就不滚动了，然后继续划出屏幕， 感觉不满意的可以自行处理，把分母加上ImageView的高度也行，随意.

---