ViewPage实现引导页的切换，且滑到最后一页再滑时进入到主页。

最近做的项目需求是这样的

滑动切换引导页，滑动过程中背景颜色呈现过渡的状态，字体从底部向上显示，然后滑到最后一页再滑时进入到主页，效果图如下：

具体代码如下：

package cn.gengee.matches;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.GestureDetector;
import android.view.KeyEvent;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RadioGroup;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

import cn.gengee.matches.modules.matches.ui.MatchListActivity;
import cn.gengee.matches.utils.ScreenUtils;

/**
 * 引导页
 *
 * @author xiaobo on 2016-9-21
 */
public class GuideActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {

    private View mBgColor1;
    private View mBgColor2;
    private View mBgColor3;
    private ViewPager mViewPager;
    private RadioGroup mRgIndicator;
    private TextView mText;
    private int currentItem = 0; // 当前图片的位置
    private int flaggingWidth;// 滑动关闭引导页所需滚动的长度
    private GestureDetector gestureDetector; // 用户滑动
    private List<View> mPageViews;
    private ImageView mImageView;
    private List<TextView> mTextList = new ArrayList<>();
    private int[] textStr = {R.string.guide_describe1,
            R.string.guide_describe2, R.string.guide_describe3};
    private int[] images = new int[]{
            R.mipmap.bg_wt01,
            R.mipmap.bg_wt02,
            R.mipmap.bg_wt03
    };

    public static void startAction(Context context) {
        context.startActivity(new Intent(context, GuideActivity.class));
    }

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

        gestureDetector = new GestureDetector(new GuideViewTouch());
        
        flaggingWidth = ScreenUtils.dip2px(20);

        initUI();
    }

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

        switch (position) {
            case 0:
                mBgColor1.setAlpha(1 - positionOffset);
                mBgColor2.setAlpha(positionOffset);
                break;
            case 1:
                mBgColor2.setAlpha(1 - positionOffset);
                mBgColor3.setAlpha(positionOffset);
                break;
            default:
                break;
        }
    }

    @Override
    public void onPageSelected(int position) {
        currentItem = position;
        mRgIndicator.check(mRgIndicator.getChildAt(position).getId());
        startAnim(position);
    }

    @Override
    public void onPageScrollStateChanged(int state) {
    }

    /**
     * 点击返回按钮也让用户进入到 MatchListActivity 页
     *
     * @param keyCode
     * @param event
     * @return
     */
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            MatchListActivity.redirectTo(this);
            finish();
            return false;
        }
        return super.onKeyDown(keyCode, event);
    }

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        if (gestureDetector.onTouchEvent(event)) {
            event.setAction(MotionEvent.ACTION_CANCEL);
        }
        return super.dispatchTouchEvent(event);
    }

    private void initUI() {

        mBgColor1 = findViewById(R.id.bg_color1);
        mBgColor2 = findViewById(R.id.bg_color2);
        mBgColor3 = findViewById(R.id.bg_color3);

        LayoutInflater inflater = LayoutInflater.from(this);
        mPageViews = new ArrayList<>();
        for (int i = 0, len = images.length; i < len; i++) {
            View pageView = inflater.inflate(R.layout.item_vp_guide, null);
            mImageView = (ImageView) pageView.findViewById(R.id.image);
            mText = (TextView) pageView.findViewById(R.id.tv_content);
            mImageView.setImageResource(images[i]);
            mText.setText(textStr[i]);
            if (i == 0) {
                mText.setAlpha(1f);
            }
            mTextList.add(mText);
            mPageViews.add(pageView);
        }

        mViewPager = (ViewPager) findViewById(R.id.viewPager);
        mViewPager.setAdapter(new GuidePagerAdapter());
        mViewPager.addOnPageChangeListener(this);

        mRgIndicator = (RadioGroup) findViewById(R.id.indicator);
        mRgIndicator.check(mRgIndicator.getChildAt(0).getId());

    }

    private void startAnim(int position) {
        ObjectAnimator moveIn = ObjectAnimator.ofFloat
                (mTextList.get(position), "translationY", 150f, 0f);
        ObjectAnimator fadeInOut = ObjectAnimator.ofFloat
                (mTextList.get(position), "alpha", 0f, 1f);
        AnimatorSet animSet = new AnimatorSet();
        animSet.play(moveIn).with(fadeInOut);
        animSet.setDuration(300);
        animSet.start();
    }

    /**
     * 自定义的 PagerAdapter
     */
    private class GuidePagerAdapter extends PagerAdapter {

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            container.addView(mPageViews.get(position));
            return mPageViews.get(position);
        }

        @Override
        public void destroyItem(ViewGroup container, int position,
                                Object object) {
            container.removeView(mPageViews.get(position));
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public int getCount() {
            return images.length;
        }

    }

    /**
     * 当滑动到最后一页时，继续滑动将进入到联赛选择列表页
     */
    private class GuideViewTouch extends 
            GestureDetector.SimpleOnGestureListener {
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, 
                              float velocityX,float velocityY) {
            if (currentItem == 2) {
                if (Math.abs(e1.getX() - e2.getX()) > Math.abs(e1.getY() 
                  - e2.getY()) && (e1.getX() - e2.getX() <= (-flaggingWidth)
                        || e1.getX() - e2.getX() >= flaggingWidth)) {
                 if (e1.getX() - e2.getX() >= flaggingWidth) {
                   MatchListActivity.redirectTo(GuideActivity.this, true);
                   finish();
                   return true;
                    }
                }
            }
            return false;
        }
    }
}

XML文件如下：

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".GuideActivity">

    <View
        android:id="@+id/bg_color1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/guide_bg_green"/>

    <View
        android:id="@+id/bg_color2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:alpha="0"
        android:background="@color/guide_bg_yellow"/>

    <View
        android:id="@+id/bg_color3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:alpha="0"
        android:background="@color/guide_bg_orange"/>

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

    <RadioGroup
        android:id="@+id/indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="16dp"
        android:gravity="center"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/radioButton1"
            android:layout_width="6dp"
            android:layout_height="6dp"
            android:background="@drawable/sl_rdobtn_guide_page"
            android:button="@null"
            android:enabled="false"/>

        <RadioButton
            android:id="@+id/radioButton2"
            android:layout_width="6dp"
            android:layout_height="6dp"
            android:layout_margin="14dp"
            android:background="@drawable/sl_rdobtn_guide_page"
            android:button="@null"
            android:enabled="false"/>

        <RadioButton
            android:id="@+id/radioButton3"
            android:layout_width="6dp"
            android:layout_height="6dp"
            android:background="@drawable/sl_rdobtn_guide_page"
            android:button="@null"
            android:enabled="false"/>
    </RadioGroup>

</RelativeLayout>