Android ViewPager 打造炫酷欢迎页

ViewPager是Android扩展v4包中的类，这个类可以让用户切换当前的View。对于这个类的应用场景，稍加修改就可以应用到多个环境下。比如：App的欢迎页，App导航页设计，app的侧滑退出和app的侧边栏应用界面设计等都可以用ViewPager实现。

   

1. 关于欢迎页的导航设计

• 设计思想：欢迎页的导航包括几个app说明（欢迎页），页面的下方有导航点，显示当前所在的页面数，自动跳转下一页，最后一页有进入的 登陆\注册 的按钮。或者有提示进入的按钮。或者有直接的登陆或者注册的输入框。输入完成后进入主界面。

• 代码设计：创建包容欢迎页面的视图集合，包含指示当前第几页的“点”的集合，包含最后一页的跳转设计，包含用户当前不操作的自动跳转，包含用户销毁当前应用第二次进入的跳过欢迎页等设计。

2. 欢迎页的引导页设计

• 1.引导类：

//建立Guide类继承自 AppCompatActivity，实现OnPageChangeListener 并实现OnPageChangeListener的onPageScrolled，onPageSelected，onPageScrollStateChanged类。

public class Guide extends AppCompatActivity implements ViewPager.OnPageChangeListener {private ViewPager vp;private ViewPagerAdapter vpAdapter;   //创建ViewPager适配器private List
    
      views;   //创建视图集合private ImageView[] dots;   //创建指示点集合private int[] ids = {R.id.iv_bit1, R.id.iv_bit2, R.id.iv_bit3, R.id.iv_bit4};   //初始化指示点集合private Button btn_start;   //初始末页跳转按钮@Overrideprotected void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    requestWindowFeature(Window.FEATURE_NO_TITLE);   //欢迎页无标题设置    setContentView(R.layout.guide_layout);     initViews();    initDots();}private void initViews() {    LayoutInflater inflater = LayoutInflater.from(this);    views = new ArrayList
     
      ();    views.add(inflater.inflate(R.layout.one, null));    views.add(inflater.inflate(R.layout.two, null));    views.add(inflater.inflate(R.layout.three, null));    views.add(inflater.inflate(R.layout.four, null));    vpAdapter = new ViewPagerAdapter(views, this);    vp = (ViewPager) findViewById(R.id.viewPager);    vp.setAdapter(vpAdapter);    //适配器适配页面    btn_start = (Button) views.get(3).findViewById(R.id.btn_start);    //到第四页点击按钮跳转    btn_start.setOnClickListener(new View.OnClickListener() {        @Override        public void onClick(View view) {            Intent intent = new Intent(Guide.this,MainActivity.class);            //跳转到主Activity            startActivity(intent);            finish();   //销毁没有用的内存占用        }    });    vp.setOnPageChangeListener(this);}private void initDots() {    dots = new ImageView[views.size()];    for (int i = 0; i < views.size(); i++) {        dots[i] = (ImageView) findViewById(ids[i]);           //根据当前页面的views.size()来变化指示图标    }}@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}//指示点的变化函数@Overridepublic void onPageSelected(int position) {    for (int i = 0; i < ids.length; i++) {        if (position == i) {            dots[i].setImageResource(R.drawable.login_point_selected);        } else {            dots[i].setImageResource(R.drawable.login_point);        }    }}@Overridepublic void onPageScrollStateChanged(int state) {}}
     
    

• 2.引导视图：

位于页面最下方的四个点：第一个是默认被选中的点。

• 3.打造视图适配器：

//建立ViewPagerAdapter继承自 PagerAdapter,并实现其destroyItem，instantiateItem，getCount，isViewFromObject方法。构造ViewPagerAdapter的内部类，创建View的数组类和联系上下文的Context。

public class ViewPagerAdapter extends PagerAdapter {private List
    
      views;private Context context;public ViewPagerAdapter(List
     
       views,Context context){    this.views = views;    this.context = context;}@Overridepublic void destroyItem(View container, int position, Object object) {    ((ViewPager)container).removeView(views.get(position));}@Overridepublic Object instantiateItem(View container, int position) {    ((ViewPager)container).addView(views.get(position));    return views.get(position);}@Overridepublic int getCount() {    return views.size();}@Overridepublic boolean isViewFromObject(View view, Object object) {    return (view == object);}}
     
    

• 4.分别实现四个欢迎视图：

第一个欢迎界面：

第四（末）个欢迎界面：

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

• 5.建立控制进入与跳转变化的类WelCome：

//用异步的方法来实现跳转的判断

public class Welcome extends AppCompatActivity {private boolean isFirstIn = false;   //设置第一次进入为falseprivate static final int TIME = 2300;   //从logo界面到欢迎页的时间为2.3秒private static final int GO_HOME = 1000;   //到主页的时间private static final int GO_GUIDE = 1001;   //到欢迎页的时间多1来判断private Handler mHandler = new Handler(){   //异步信息    @Override    public void handleMessage(Message msg) {        switch (msg.what){            case GO_HOME:                goHome();            break;            case GO_GUIDE:                goGuide();                break;            default:                break;        }    }};@Overrideprotected void onCreate(Bundle savedInstanceState) {    final Intent intent = new Intent(Welcome.this,MainActivity.class);    super.onCreate(savedInstanceState);    setContentView(R.layout.welcome_layout);    init();   //自定义方法判断是否第一次开启App    //设置自动跳转时间Timer 无响应后10秒自动跳转    Timer timer = new Timer();    TimerTask task = new TimerTask() {        @Override        public void run() {           startActivity(intent);        }    };    timer.schedule(task,1000*10);    finish();}private void init(){    SharedPreferences preferences = getPreferences(MODE_PRIVATE);    isFirstIn = preferences.getBoolean("isFirstIn",true);    if (!isFirstIn){        mHandler.sendEmptyMessageDelayed(GO_HOME,TIME);    }else {        mHandler.sendEmptyMessageDelayed(GO_GUIDE,TIME);        SharedPreferences.Editor editor = preferences.edit();        editor.putBoolean("isFirstIn",false);        editor.commit();    }}private void goHome() {    Intent intent = new Intent(Welcome.this,MainActivity.class);    startActivity(intent);    finish();}private void goGuide() {    Intent intent = new Intent(Welcome.this,Guide.class);    startActivity(intent);    finish();}}

• 6.WelCome视图：

加入logo的ImageView视图：

• 7.修改AndroidManifest.xml 注册信息以及首选开启项：

修改主题为NoTitleBar，修改引导页为WelCome类：

• 8.总结：

需要导入V4的jar包。至此，一个热气腾腾的欢迎页就完成了。