利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果

本文主要介绍如何利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果。即google play首页、新浪微博消息(at、评论、私信、广播）页面的效果。ViewPager+Fragment组合为google推荐方式，比TabActivity+Activity的效率高的多。

这个效果相当好！

1、新建ViewPager的layout，内容如下

<?xmlversion="1.0"encoding="utf-8"?>
<LinearLayoutxmlns: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等。

2、新建FragmentActivity页面
FragmentActivity页面含有ViewPager元素，可以用来显示Fragment，定义如下：

FragmentActivity页面

publicclassViewPagerDemoextendsFragmentActivity{

/**页面list**/
List<Fragment>fragmentList=newArrayList<Fragment>();
/**页面titlelist**/
List<String>titleList=newArrayList<String>();

@Override
protectedvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.view_pager_demo);

ViewPagervp=(ViewPager)findViewById(R.id.viewPager);
fragmentList.add(newViewPagerFragment1("页面1"));
fragmentList.add(newViewPagerFragment1("页面2"));
fragmentList.add(newViewPagerFragment1("页面3"));
titleList.add("title1");
titleList.add("title2");
titleList.add("title3");
vp.setAdapter(newmyPagerAdapter(getSupportFragmentManager(),fragmentList,titleList));
}

/**
*定义适配器
*
*@[e-mail]2012-11-15
*/
classmyPagerAdapterextendsFragmentPagerAdapter{

privateList<Fragment>fragmentList;
privateList<String>titleList;

publicmyPagerAdapter(FragmentManagerfm,List<Fragment>fragmentList,List<String>titleList){
super(fm);
this.fragmentList=fragmentList;
this.titleList=titleList;
}

/**
*得到每个页面
*/
@Override
publicFragmentgetItem(intarg0){
return(fragmentList==null||fragmentList.size()==0)?null:fragmentList.get(arg0);
}

/**
*每个页面的title
*/
@Override
publicCharSequencegetPageTitle(intposition){
return(titleList.size()>position)?titleList.get(position):"";
}

/**
*页面的总个数
*/
@Override
publicintgetCount(){
returnfragmentList==null?0:fragmentList.size();
}
}
}

其中的myPagerAdapter集成自ragmentPagerAdapter，为ViewPager提供数据源。

onCreate函数得到ViewPager实例并设置数据源，getSupportFragmentManager表示得到Fragment管理器。ViewPagerFragment1表示具体的页面，见下面介绍。

3、新建Fragment页面
Fragment页面即为左右滑动需要显示的页面，新建类集成Fragment，并重写onCreateView函数即可。onCreateView函数相当于Activity的onCreate函数。如下：

publicclassViewPagerFragment1extendsFragment{

privateStringtext;
privateTextViewtv=null;

publicViewPagerFragment1(Stringtext){
super();
this.text=text;
}

/**
*覆盖此函数，先通过inflaterinflate函数得到view最后返回
*/
@Override
publicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer,BundlesavedInstanceState){
Viewv=inflater.inflate(R.layout.view_pager_fragment_demo1,container,false);
tv=(TextView)v.findViewById(R.id.viewPagerText);
tv.setText(text);
returnv;
}
}

简单效果如下：