美团分类导航按钮效果使用ViewPager+GridView实现左右滑动查看更多分类的功能

转载自：http://blog.csdn.net/qq_20785431/article/details/52528404

不记得什么时候，我留意到到美团网首页有使用ViewPager+GridView实现左右滑动查看更多分类的一个功能，感觉它很有趣，于是想着自己动手也实现这样一个功能，和往常一样，主要是想总结一下我在学习过程中的一些笔记以及需要注意的地方。 
其中需要注意的有如下几个点： 
一：使用GridView作为每个ViewPager的页面，也就是说每个ViewPager的页面都是inflate出一个GridView新实例 
二：如何将GridView和ViewPager关联起来：在刚刚第一点所说的，有多少个ViewPager的页面就会inflate出多少个GridView作为每页的VIew加入集合中，并将这个集合作为ViewPager的数据源传给ViewPager的Adapter

三：在ViewPager翻页时，如何让GridView显示正确的数据： 
（1）给GridView设置Adapter时，除了需要传入总数据集mDatas之外，还需要传入当前页数以及每一页显示的个数，然后经过计算得出正确的count和应该显示的View的数据 
（2）在GridView中Adapter中修改getCount()方法：

（3）修改getView()方法： 
在给View绑定显示的数据时，根据当前下标curIndex和每页显示最大数pageSize ，计算一下正确的position = position + curIndex * pageSize

（4）修改getItem()和getItemId()方法

四、如何在ViewPager翻页时，正确显示目前选中的是那一页呢，也就是说在左右滑动时，下面小圆点的状态也要相应地做出改变：

五、在初始化数据源时，如何动态获取资源ID：

就这五点吧，现在我们先来看看美团网首页使用ViewPager+GridView实现左右滑动查看更多分类的效果图： 
 
再来看一下我们最终效果图： 
 
现在我们来看下项目结构图 

大家可以点击源码下载：

http://download.csdn.net/detail/xiaoqiang_0719/9653681