android ViewPager制作广告栏

  我们常用的app中，首页多半都会展示广告的地方(特别是电商产品)，比如下面这张图中被圈出的部分，就是我所说的广告栏

广告栏的需求就是：展示活动的广告图，

(1)用户可以左右滑动来选择；

(2)广告可以自动轮流播放，即过一定时间，展示下一张广告；

(3)当用户手指触摸到广告栏时，自动播放停止

(5)图片右下角的圆点和广告图播放位置显示一致，即：播放第一种，第一个圆点亮，其他都暗

(6)圆点可以点击，即：点第三个圆点，展示第三张广告图

实现

看到需求1，首先想到控件ViewPager,看到需求6，想到的是右下角的圆点是RadioButton，这样很容易就控制了单选。先满足这两个要求的实现吧！

广告栏的布局：

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:background="#696969" />

    <include layout="@layout/radio_layout" />

</RelativeLayout>

radio_layout.xml就是单选按钮的布局：

<?xml version="1.0" encoding="utf-8"?>
<RadioGroup xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RadioGroup"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/viewpager"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="5dp"
    android:orientation="horizontal">

    <RadioButton
        android:id="@+id/radio1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:checked="true"
        android:drawableLeft="@drawable/radiobutton_selector"
        android:padding="2dp" />

    <RadioButton
        android:id="@+id/radio2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@null"
        android:drawableLeft="@drawable/radiobutton_selector"
        android:padding="2dp" />

    <RadioButton
        android:id="@+id/radio3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:butt