Android 利用ViewPager、Fragment、PagerTabStrip實現多頁面滑動效果

原帖：http://www.cnblogs.com/trinea/archive/2012/11/23/2771273.html

本文主要介紹如何利用ViewPager、Fragment、PagerTabStrip實現多頁面滑動效果。即google play首頁、新浪微博消息(at、評論、私信、廣播）頁面的效果。ViewPager+Fragment組合為google推薦方式，比TabActivity+Activity的效率高的多。

這個效果相當好！

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

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width_="match_parent"
4. android:layout_height="match_parent"
5. android:orientation="vertical">
7. <android.support.v4.view.ViewPager
8. android:id="@+id/viewPager"
9. android:layout_width_="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_gravity="center">
12. <android.support.v4.view.PagerTabStrip
13. android:layout_width_="wrap_content"
14. android:layout_height="wrap_content"
15. android:layout_gravity="top"/>
16. </android.support.v4.view.ViewPager>
17. </LinearLayout>

ViewPager用來管理layout並可以左右滑動顯示各個頁面數據，PagerTabStrip用來顯示頁面title，android:layout_gravity="top"表示title在頂部，可設置bottom等。

2、新建FragmentActivity頁面FragmentActivity頁面含有ViewPager元素，可以用來顯示Fragment，定義如下：

1. FragmentActivity頁面
3. publicclassViewPagerDemoextendsFragmentActivity{
5. /**頁面list**/
6. List<Fragment>fragmentList=newArrayList<Fragment>();
7. /**頁面titlelist**/
8. List<String>titleList=newArrayList<String>();
10. @Override
11. protectedvoidonCreate(BundlesavedInstanceState){
12. super.onCreate(savedInstanceState);
13. setContentView(R.layout.view_pager_demo);
15. ViewPagervp=(ViewPager)findViewById(R.id.viewPager);
16. fragmentList.add(newViewPagerFragment1("頁面1"));
17. fragmentList.add(newViewPagerFragment1("頁面2"));
18. fragmentList.add(newViewPagerFragment1("頁面3"));
19. titleList.add("title1");
20. titleList.add("title2");
21. titleList.add("title3");
22. vp.setAdapter(newmyPagerAdapter(getSupportFragmentManager(),fragmentList,titleList));
23. }
25. /**
26. *定義適配器
27. *
28. *@authorgxwu@lewatek.com2012-11-15
29. */
30. classmyPagerAdapterextendsFragmentPagerAdapter{
32. privateList<Fragment>fragmentList;
33. privateList<String>titleList;
35. publicmyPagerAdapter(FragmentManagerfm,List<Fragment>fragmentList,List<String>titleList){
36. super(fm);
37. this.fragmentList=fragmentList;
38. this.titleList=titleList;
39. }
41. /**
42. *得到每個頁面
43. */
44. @Override
45. publicFragmentgetItem(intarg0){
46. return(fragmentList==null||fragmentList.size()==0)?null:fragmentList.get(arg0);
47. }
49. /**
50. *每個頁面的title
51. */
52. @Override
53. publicCharSequencegetPageTitle(intposition){
54. return(titleList.size()>position)?titleList.get(position):"";
55. }
57. /**
58. *頁面的總個數
59. */
60. @Override
61. publicintgetCount(){
62. returnfragmentList==null?0:fragmentList.size();
63. }
64. }
65. }

其中的myPagerAdapter集成自ragmentPagerAdapter，為ViewPager提供數據源。

onCreate函數得到ViewPager實例並設置數據源，getSupportFragmentManager表示得到Fragment管理器。ViewPagerFragment1表示具體的頁面，見下面介紹。

3、新建Fragment頁面Fragment頁面即為左右滑動需要顯示的頁面，新建類集成Fragment，並重寫onCreateView函數即可。onCreateView函數相當於Activity的onCreate函數。如下：

1. publicclassViewPagerFragment1extendsFragment{
3. privateStringtext;
4. privateTextViewtv=null;
6. publicViewPagerFragment1(Stringtext){
7. super();
8. this.text=text;
9. }
11. /**
12. *覆蓋此函數，先通過inflaterinflate函數得到view最後返回
13. */
14. @Override
15. publicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer,BundlesavedInstanceState){
16. Viewv=inflater.inflate(R.layout.view_pager_fragment_demo1,container,false);
17. tv=(TextView)v.findViewById(R.id.viewPagerText);
18. tv.setText(text);
19. returnv;
20. }
21. }

簡單效果如下：

推薦閱讀：