Android应用中利用ViewPager实现多页面滑动切换效果示例

1、添加android support包
因为上面的几个类都是在android support包中才提供，我们先添加包。
在eclipse->window->android sdk manager，选择列表中extras->android support library进行安装。下载完后在android-sdk\extras\android\support目录下，这里我们选择v4版本，进入v4目录，拷贝其中的android-support-v4.jar文件到工程的libs目录(若没有新建)下即可，编译时adt会自动将其导入项目中。

2、新建viewpager的layout，内容如下

<?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.support.v4.view.viewpager
    android:id="@+id/viewpager"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center" >
    <android.support.v4.view.pagertabstrip  
      android:layout_width="wrap_content"  
      android:layout_height="wrap_content"  
      android:layout_gravity="top" />
  </android.support.v4.view.viewpager>
</linearlayout>

viewpager用来管理layout并可以左右滑动显示各个页面数据，pagertabstrip用来显示页面title，android:layout_gravity="top"表示title在顶部，可设置bottom等。

 

3、新建fragmentactivity页面
fragmentactivity页面含有viewpager元素，可以用来显示fragment，定义如下：

public class viewpagerdemo extends fragmentactivity {

  /** 页面list **/
  list<fragment> fragmentlist = new arraylist<fragment>();
  /** 页面title list **/
  list<string>  titlelist  = new arraylist<string>();

  @override
  protected void oncreate(bundle savedinstancestate) {
    super.oncreate(savedinstancestate);
    setcontentview(r.layout.view_pager_demo);

    viewpager vp = (viewpager)findviewbyid(r.id.viewpager);
    fragmentlist.add(new viewpagerfragment1("页面1"));
    fragmentlist.add(new viewpagerfragment1("页面2"));
    fragmentlist.add(new viewpagerfragment1("页面3"));
    titlelist.add("title 1 ");
    titlelist.add("title 2 ");
    titlelist.add("title 3 ");
    vp.setadapter(new mypageradapter(getsupportfragmentmanager(), fragmentlist, titlelist));
  }

  /**
   * 定义适配器
   */
  class mypageradapter extends fragmentpageradapter {

    private list<fragment> fragmentlist;
    private list<string>  titlelist;

    public mypageradapter(fragmentmanager fm, list<fragment> fragmentlist, list<string> titlelist){
      super(fm);
      this.fragmentlist = fragmentlist;
      this.titlelist = titlelist;
    }

    /**
     * 得到每个页面
     */
    @override
    public fragment getitem(int arg0) {
      return (fragmentlist == null || fragmentlist.size() == 0) ? null : fragmentlist.get(arg0);
    }

    /**
     * 每个页面的title
     */
    @override
    public charsequence getpagetitle(int position) {
      return (titlelist.size() > position) ? titlelist.get(position) : "";
    }

    /**
     * 页面的总个数
     */
    @override
    public int getcount() {
      return fragmentlist == null ? 0 : fragmentlist.size();
    }
  }
}

其中的mypageradapter集成自ragmentpageradapter，为viewpager提供数据源。

oncreate函数得到viewpager实例并设置数据源，getsupportfragmentmanager表示得到fragment管理器。viewpagerfragment1表示具体的页面，见下面介绍。

4、新建fragment页面
fragment页面即为左右滑动需要显示的页面，新建类集成fragment，并重写oncreateview函数即可。oncreateview函数相当于activity的oncreate函数。如下：

public class viewpagerfragment1 extends fragment {

  private string  text;
  private textview tv = null;

  public viewpagerfragment1(string text){
    super();
    this.text = text;
  }

  /**
   * 覆盖此函数，先通过inflater inflate函数得到view最后返回
   */
  @override
  public view oncreateview(layoutinflater inflater, viewgroup container, bundle savedinstancestate) {
    view v = inflater.inflate(r.layout.view_pager_fragment_demo1, container, false);
    tv = (textview)v.findviewbyid(r.id.viewpagertext);
    tv.settext(text);
    return v;
  }
}

5、示例工程代码：

package cn.trinea.android.demo;

import java.util.arraylist;
import java.util.list;

import android.os.bundle;
import android.support.v4.app.fragment;
import android.support.v4.app.fragmentmanager;
import android.support.v4.app.fragmentpageradapter;
import android.support.v4.view.viewpager;

public class viewpagerdemo extends basefragmentactivity {

  private static int total_count = 3;

  @override
  protected void oncreate(bundle savedinstancestate) {
    super.oncreate(savedinstancestate, r.layout.view_pager_demo);

    viewpager vp = (viewpager)findviewbyid(r.id.view_pager);
    list<fragment> fragmentlist = new arraylist<fragment>();
    list<string> titlelist = new arraylist<string>();
    for (int i = 0; i < total_count; i++) {
      viewpagerfragment viewpagerfragment1 = new viewpagerfragment();
      bundle bundle = new bundle();
      bundle.putint("upimageid", 0);
      bundle.putstring("text", "page " + i);
      viewpagerfragment1.setarguments(bundle);
      titlelist.add("title " + i);
      fragmentlist.add(viewpagerfragment1);
    }

    vp.setadapter(new mypageradapter(getsupportfragmentmanager(), fragmentlist, titlelist));

  }

  class mypageradapter extends fragmentpageradapter {

    private list<fragment> fragmentlist;
    private list<string>  titlelist;

    public mypageradapter(fragmentmanager fm, list<fragment> fragmentlist, list<string> titlelist) {
      super(fm);
      this.fragmentlist = fragmentlist;
      this.titlelist = titlelist;
    }

    @override
    public fragment getitem(int arg0) {
      return (fragmentlist == null || fragmentlist.size() == 0) ? null : fragmentlist.get(arg0);
    }

    @override
    public charsequence getpagetitle(int position) {
      return (titlelist.size() > position) ? titlelist.get(position) : "";
    }

    @override
    public int getcount() {
      return fragmentlist == null ? 0 : fragmentlist.size();
    }
  }
}

简单效果如下：