ViewPager和GridView实现左右滑动功能及点击事件

        ViewPager 是与一组页面进行交互的容器，那么怎么设计交互的接口就成为设计成败的关键。我们会发现 GridView 中使用的「通信接口」是 BaseAdapter， 那么类似地，ViewPager 在设计的时候， 同样采用了 Adapter 的设计模式， 通过 PagerAdapter 来实现交互。

        我们要达成的协议应该如下，ViewPager 负责显示页面，处理滑动等逻辑，而 PagerAdapter 负责实现如何渲染界面等具体接口。ViewPager 不直接操作页面，把这一切逻辑都放在 PagerAdapter 里面去，甚至页面复用这些逻辑也交由 PageAdapter 处理。那么我们来看看 PagerAdapter 是如何定义的？

这里是ViewPaer+GridView实现的效果图:

                                                                                                        

activity_mian.xml布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <!--定义了一个ViewPager,高度150dp,在不同的机型会有问题,项目适配时,要改成dimens-->
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="150dp">
    </android.support.v4.view.ViewPager>
</RelativeLayout>

布局整好以后我们在values下创建一个arrays资源文件,他是一个数组,用来存放标题和图标,下面给大家详细介绍他的实现方法:

<!--一个array就是一个数组,name:就是数组名,item:就是一个元素,里面包裹元素的位置,从上到下就是从0角标,不断增大,字符串的数组-->

<?xml version="1.0" encoding="utf-8"?>
<resources>
     <!--这个是标题-->
    <array name="home_bar_labels">
        <item>美食</item>
        <item>电影</item>
        <item>酒店</item>
        <item>休闲娱乐</item>
        <item>自助餐</item>
        <item>KTV</item>
        <item>蛋糕甜点</item>
        <item>旅游</item>
        <item>购物</item>
        <item>摄影写真</item>
        <item>丽人</item>
        <item>生活服务</item>
        <item>门票</item>
        <item>抽奖公益</item>
        <item>今日新单</item>
        <item>全部分类</item>
    </array>
 
       <!--这个是图标-->
    <array name="home_bar_icon">
        <item>@mipmap/icon_home_food_99</item>
        <item>@mipmap/icon_home_movie_29</item>
        <item>@mipmap/icon_home_hotel_300</item>
        <item>@mipmap/icon_home_happy_2