ViewPager的简单使用

ViewPager简单介绍：

很多主流的手机应用，当用户首次安装或者更新时，都会出现三四页的引导页，主要用来介绍应用的功能或者新增特效。

引导页就可以通过ViewPager来实现，下面就给读者介绍一种ViewPager最简单基本的用法。

这里简单模仿FlipBoard的引导页，效果图见文章结尾。

首先需要创建引导页的Activity 名为Guide.java 继承自 Activity。

关键代码如下：

public class Guide extends Activity{
    private ViewPager vp;
    private ViewPagerAdapter vpAdapter;
    private List<View> views;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.guide);
        initViews();
    }
    
    private void initViews() {
        LayoutInflater inflater = LayoutInflater.from(this);
        views = new ArrayList<View>();
        views.add(inflater.inflate(R.layout.fbone, null));
        views.add(inflater.inflate(R.layout.fbtwo, null));
        views.add(inflater.inflate(R.layout.fbthree, null));
        views.add(inflater.inflate(R.layout.fbfour, null));
        
        vpAdapter = new ViewPagerAdapter(views, this);
        vp = (ViewPager)findViewById(R.id.viewpager);
        vp.setAdapter(vpAdapter);
    }
}

若想使用ViewPager 需要我们写一个Adapter 名为ViewPagerAdapter 继承自 PagerAdapter。

在这个Adapter内需要简单重写父类的部分方法。

方法 destroyItem 和 instantiateItem 就是我选择重写的。

关键代码如下：

public class ViewPagerAdapter extends PagerAdapter {
    
    private List<View> views;
    private Context context;
    
    public ViewPagerAdapter(List<View> views, Context context) {
        super();
        this.views = views;
        this.context = context;
    }

    @Override
    public int getCount() {    
        return views.size();
    }
    
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(views.get(position));
    }
    
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(views.get(position));
        return views.get(position);
    }

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

}

java代码如上述，下面简单介绍xml代码。

前文已经讲述引导页的java代码，对应需要创建一个xml 名为guide.xml。

此处需要注意必须正确导入android.support.v4包，新版本的ADT自带。

代码如下：

<?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/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"> 
    </android.support.v4.view.ViewPager>    

</RelativeLayout>

写到此处框架就基本完成，只需要我们往里面添加每张引导页的视图。

在上文的Gude.java中的初始化视图方法initViews()中可以看出，我往里面添加了四个布局文件。

下面就只贴出其中一个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" >
    
    <ImageView 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/fbone"/>

</LinearLayout>

尾注 为了简单调试 我修改了Android.Manifest.xml 将程序入口的Activity设为Guide。

效果图如下：

转载请注明出处：http://www.cnblogs.com/michaelwong/p/4114947.html