Android学习之路---使用ViewPager实现引导页

　　许多app安装之后都有可滑动的引导页，今天看了视频学习了下ViewPager的使用。
　　
　　下面是我的实现：
　　
　　1.主类：

public class ViewPagerProject extends Activity implements ViewPager.OnPageChangeListener {

    private ViewPager viewPager;
    private ArrayList<View> views = new ArrayList<>();//装载每个view的容器
    private ImageView[] imageViews;//小圆点数组
    private int currentIndex;//当前正在显示的卡页

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_pager_project);
        initView();
        initDot();

    }

    /**
     * 初始化底部圆点
     */
    private void initDot() {
        LinearLayout layout = (LinearLayout) findViewById(R.id.dotLayout);//找到盛放四个小圆点的LinearLayout布局
        imageViews = new ImageView[views.size()];
        for (int i = 0; i < imageViews.length; i++) {
            imageViews[i] = (ImageView) layout.getChildAt(i);//得到LinearLayout布局中的每个小圆点图片
        }
        currentIndex = 0;//设置默认显示第一选项卡
        imageViews[currentIndex].setImageResource(R.mipmap.point_focused);//设置默认第一选项卡的小圆点为被选中

    }

    /**
     * 设置小圆点的图片
     *
     * @param position
     */
    private void setCurrentIndex(int position) {
        if (currentIndex < 0 || currentIndex == position || currentIndex > imageViews.length - 1) {
            return;
        }
        imageViews[currentIndex].setImageResource(R.mipmap.point_unfocused);//将上一个选项卡小圆点设置为未被选中
        imageViews[position].setImageResource(R.mipmap.point_focused);//将选中的选项卡的小圆点设置为被选中
        currentIndex = position;//将“上一个”选项卡位置设置为当前选项卡位置
    }

    private void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewPager_project);
        //将每个选项卡视图添加到views容器中
        views.add(getLayoutInflater().inflate(R.layout.layout1, null));
        views.add(getLayoutInflater().inflate(R.layout.layout2, null));
        views.add(getLayoutInflater().inflate(R.layout.layout3, null));
        views.add(getLayoutInflater().inflate(R.layout.layout4, null));

        //设置默认显示的选项卡
        viewPager.setCurrentItem(1);
        viewPager.setAdapter(new MyPagerAdapter());//添加适配器
        viewPager.setOnPageChangeListener(this);//注册滑动界面事件
    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {
        setCurrentIndex(position);
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }

    /**
     * 自定义适配器
     */
    class MyPagerAdapter extends PagerAdapter {

        @Override
        public int getCount() {
            return views.size();//返回views容器大小
        }

        /**
         * 判断view和对象是否相等
         *
         * @param view
         * @param object
         * @return
         */
        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;//常用写法
        }


        /**
         * 实例化选项卡
         *
         * @param container
         * @param position
         * @return
         */
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View view = views.get(position);//得到选项卡视图
            container.addView(view);//添加选项卡视图
            return view;
        }

        /**
         * 删除选项卡
         *
         * @param container
         * @param position
         * @param object
         */
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(views.get(position));//删除视图
        }
    }
}

　　2.主布局文件activity_view_pager_project.xml：最外面是帧布局，里面有个ViewPager，下方是一个LinearLayout，LinearLayout中存放着四张小圆点图片：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_view_pager_project"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="cn.nuc.rxk.highui2.ViewPagerProject">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager_project"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <LinearLayout
        android:id="@+id/dotLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center"
        android:gravity="center">

        <ImageView
            android:layout_width="20dp"
            android:paddingRight="10dp"
            android:layout_height="20dp"
            android:src="@mipmap/point_unfocused" />

        <ImageView
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:paddingRight="10dp"
            android:src="@mipmap/point_unfocused" />

        <ImageView
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:paddingRight="10dp"
            android:src="@mipmap/point_unfocused" />

        <ImageView
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:paddingRight="10dp"
            android:src="@mipmap/point_unfocused" />
    </LinearLayout>

</FrameLayout>

　　3.每张引导图布局layout1.xml（有4个，只是图片换了其他代码相同）：

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

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:scaleType="centerCrop"
        android:src="@mipmap/p1" />
</LinearLayout>

　　4.效果图：