（六十九）ViewPager的使用方法解析

一、ViewPager组件是用来显示左右滑动界面的控件。它的一般实现步骤是：1、在布局中加入ViewPager 2、加载要显示的页卡 3、设置适配器

二、通过使用ViewPager来实现APP的引导页面的例子，来大概知道ViewPager的使用方法

     2.1 welcome_vp.xml文件

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

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

</RelativeLayout>

    2.2 加载要显示的页卡内容，WelcomeActivity.java文件的代码如下所示：

   

package com.qf.springtourist;

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

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

import com.qf.adapter.GuideAdapter;

/*
 * 第一次运行时的引导界面
 */
public class WelcomeActivity extends Activity {
    private ViewPager mVp;
    private List<View> list;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.welcome_vp);
        mVp = (ViewPager) findViewById(R.id.welcome_vp_item);
        setDatas();
        mVp.setAdapter(new GuideAdapter(list));  
    }
    
    //要显示的页卡内容
    private void setDatas() {
        list = new ArrayList<View>();
        View fistWelcome = getLayoutInflater().inflate(
                R.layout.welcome_first_activity, null);
        View twoWelcome = getLayoutInflater().inflate(
                R.layout.welcome_two_activity, null);
        View threeWelcome = getLayoutInflater().inflate(
                R.layout.welcome_three_activity, null);
        View fourWelcome = getLayoutInflater().inflate(
                R.layout.welcome_four_activity, null);
        View fiveWelcome = getLayoutInflater().inflate(
                R.layout.welcome_five_activity, null);
        list.add(fistWelcome);
        list.add(twoWelcome);
        list.add(threeWelcome);
        list.add(fourWelcome);
        list.add(fiveWelcome);
    }
}

     2.2 welcome_first_activity.xml文件如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/guide_icon1" >

</RelativeLayout>

 

     2.3 welcome_two_activity.xml文件如下：

<?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" 
    android:background="@drawable/guide_icon2">


</LinearLayout>

 

     2.4 welcome_three_activity.xml文件如下：

<?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" 
    android:background="@drawable/guide_icon3">


</LinearLayout>

 

     2.5 welcome_four_activity.xml文件如下：

<?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"
    android:background="@drawable/guide_icon4" >
 

</LinearLayout>

 

     2.6 welcome_five_activity.xml文件如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/guide_icon5"
     >

    <Button
        android:id="@+id/press_entermain_btn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="15dp"
        android:textColor="@android:color/white"
        android:text="开启美妙之旅"
        android:background="@drawable/first_login_btn" />

</RelativeLayout>

2.7guide_icon1.jpg、guide_icon2.jpg、guide_icon3.jpg、guide_icon4.jpg和guide_icon5.jpg分别如下所示

3、定义适配器

package com.qf.adapter;

import java.util.List;

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

/*
 * 第一次运行时的引导页适配器
 */
public class GuideAdapter extends PagerAdapter {
    private List<View> mList;

    public GuideAdapter(List<View> list) {
        mList = list;
    }

    @Override
    public int getCount() { // 获得size
        return mList != null ? mList.size() : 0;
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) { // 官方提示这样写
        return arg0 == arg1;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) { // 添加页卡
        container.addView(mList.get(position));
        return mList.get(position);
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) { // 删除页卡
        // TODO Auto-generated method stub
        container.removeView(mList.get(position));
    }
}