Android ViewPager控件的使用【附源碼】

Android 4.0有個控件，就是viewpager，用來實現左右滑動效果的。我們具體來看看是如何使用的。

首先看一下效果圖

3個tab，每個tab有個layout，滑動的時候指示滑動條跟著走（當然，我覺得這個滑動條可以用三張圖片來實現，更簡單點）。

具體的我們看代碼吧，主頁xml就是實現上面三個tabbar，滑動條和一個viewpager控件，如下：

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent"
5. android:orientation="vertical" >
7. <LinearLayout
8. android:id="@+id/linearLayout1"
9. android:layout_width="fill_parent"
10. android:layout_height="100.0dip"
11. android:background="#FFFFFF" >
13. <TextView
14. android:id="@+id/text1"
15. android:layout_width="fill_parent"
16. android:layout_height="fill_parent"
17. android:layout_weight="1.0"
18. android:gravity="center"
19. android:text="頁卡1"
20. android:textColor="#000000"
21. android:textSize="22.0dip" />
23. <TextView
24. android:id="@+id/text2"
25. android:layout_width="fill_parent"
26. android:layout_height="fill_parent"
27. android:layout_weight="1.0"
28. android:gravity="center"
29. android:text="頁卡2"
30. android:textColor="#000000"
31. android:textSize="22.0dip" />
33. <TextView
34. android:id="@+id/text3"
35. android:layout_width="fill_parent"
36. android:layout_height="fill_parent"
37. android:layout_weight="1.0"
38. android:gravity="center"
39. android:text="頁卡3"
40. android:textColor="#000000"
41. android:textSize="22.0dip" />
42. </LinearLayout>
44. <ImageView
45. android:id="@+id/cursor"
46. android:layout_width="fill_parent"
47. android:layout_height="wrap_content"
48. android:scaleType="matrix"
49. android:src="@drawable/slide" />
51. <android.support.v4.view.ViewPager
52. android:id="@+id/vPager"
53. android:layout_width="wrap_content"
54. android:layout_height="wrap_content"
55. android:layout_gravity="center"
56. android:layout_weight="1.0"
57. android:background="#000000"
58. android:flipInterval="30"
59. android:persistentDrawingCache="animation" />
61. </LinearLayout>