viewPager是v4包里的一個組件，可以實現滑動顯示多個界面。
android也為viewPager提供了一個adapter，此adapter最少要重寫4個方法:
public int getCount()
public boolean isViewFromObject(View view, Object o)
public void destroyItem(ViewGroup container, int position, Object object)
public Object instantiateItem(ViewGroup container, int position)
這些方法的作用我就不說了，在代碼里面有詳細的解釋。
接下來就直接上代碼吧!!
MainActivity.java
1 package com.example.administrator.viewpagerdemo; 2 3 import android.app.Activity; 4 import android.os.Bundle; 5 import android.support.v4.view.PagerAdapter; 6 import android.support.v4.view.ViewPager; 7 import android.view.LayoutInflater; 8 import android.view.View; 9 import android.view.ViewGroup; 10 import android.widget.TabHost; 11 import android.widget.TabWidget; 12 13 import java.util.ArrayList; 14 import java.util.List; 15 16 17 public class MainActivity extends Activity { 18 19 private ViewPager viewPager = null; 20 private List<View> viewContainter = new ArrayList<View>(); //存放容器 21 private ViewPagerAdapter viewPagerAdapter = null; //聲明適配器 22 23 private TabHost mTabHost = null; 24 private TabWidget mTabWidget = null; 25 26 @Override 27 protected void onCreate(Bundle savedInstanceState) { 28 super.onCreate(savedInstanceState); 29 setContentView(R.layout.activity_main); 30 initMyTabHost(); //初始化TabHost 31 // 綁定組件 32 viewPager = (ViewPager) findViewById(R.id.viewpager); 33 initViewPagerContainter(); //初始viewPager 34 viewPagerAdapter = new ViewPagerAdapter(); 35 //設置adapter的適配器 36 viewPager.setAdapter(viewPagerAdapter); 37 //設置viewPager的監聽器 38 viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { 39 @Override 40 public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 41 42 } 43 //當 滑動 切換時 44 @Override 45 public void onPageSelected(int position) { 46 mTabWidget.setCurrentTab(position); 47 } 48 @Override 49 public void onPageScrollStateChanged(int state) { 50 51 } 52 }); 53 //TabHost的監聽事件 54 mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() { 55 @Override 56 public void onTabChanged(String tabId) { 57 if(tabId.equals("tab1")){ 58 viewPager.setCurrentItem(0); 59 }else if (tabId.equals("tab2")){ 60 viewPager.setCurrentItem(1); 61 }else if (tabId.equals("tab3")){ 62 viewPager.setCurrentItem(2); 63 }else{ 64 viewPager.setCurrentItem(3); 65 } 66 } 67 }); 68 69 //解決開始時不顯示viewPager 70 mTabHost.setCurrentTab(1); 71 mTabHost.setCurrentTab(0); 72 } 73 74 //初始化TabHost 75 public void initMyTabHost(){ 76 //綁定id 77 mTabHost = (TabHost) findViewById(android.R.id.tabhost); 78 mTabHost.setup(); 79 mTabWidget = mTabHost.getTabWidget(); 80 /** 81 * newTabSpec（） 就是給每個Tab設置一個ID 82 * setIndicator() 每個Tab的標題 83 * setCount() 每個Tab的標簽頁布局 84 */ 85 mTabHost.addTab(mTabHost.newTabSpec("tab1").setContent(R.id.tab1).setIndicator("第一頁")); 86 mTabHost.addTab(mTabHost.newTabSpec("tab2").setContent(R.id.tab2).setIndicator("第二頁")); 87 mTabHost.addTab(mTabHost.newTabSpec("tab3").setContent(R.id.tab3).setIndicator("第三頁")); 88 mTabHost.addTab(mTabHost.newTabSpec("tab4").setContent(R.id.tab4).setIndicator("第四頁")); 89 } 90 91 //初始化viewPager 92 public void initViewPagerContainter(){ 93 //建立四個view的樣式，並找到他們 94 View view_1 = LayoutInflater.from(getApplicationContext()).inflate(R.layout.viewpager_view_1,null); 95 View view_2 = LayoutInflater.from(getApplicationContext()).inflate(R.layout.viewpager_view_2,null); 96 View view_3 = LayoutInflater.from(getApplicationContext()).inflate(R.layout.viewpager_view_3,null); 97 View view_4 = LayoutInflater.from(getApplicationContext()).inflate(R.layout.viewpager_view_4,null); 98 //加入ViewPage的容器 99 viewContainter.add(view_1); 100 viewContainter.add(view_2); 101 viewContainter.add(view_3); 102 viewContainter.add(view_4); 103 } 104 105 //內部類實現viewpager的適配器 106 private class ViewPagerAdapter extends PagerAdapter{ 107 108 //該方法 決定 並 返回 viewpager中組件的數量 109 @Override 110 public int getCount() { 111 return viewContainter.size(); 112 } 113 114 @Override 115 public boolean isViewFromObject(View view, Object o) { 116 return view == o; 117 } 118 //滑動切換的時候，消除當前組件 119 @Override 120 public void destroyItem(ViewGroup container, int position, Object object) { 121 container.removeView(viewContainter.get(position)); 122 } 123 //每次滑動的時候生成的組件 124 @Override 125 public Object instantiateItem(ViewGroup container, int position) { 126 container.addView(viewContainter.get(position)); 127 return viewContainter.get(position); 128 } 129 } 130 }
activity_main.xml
在使用TabHost和TabWidget時，指定他們的id時時，android的已經為他定義好了，並且必須為他們指定這個id。而且TabHost里面必須要包含TabWedght和FrameLayout
切他們的id也必須為android已經給定的，就是下面xml代碼里的id，否則會報錯
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@android:id/tabhost"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <TabWidget android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/red" android:layout_weight="9"> </TabWidget> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_content" android:layout_height="wrap_content"> </android.support.v4.view.ViewPager> <TextView android:id="@+id/tab1" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab2" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab3" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab4" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </FrameLayout> </LinearLayout> </TabHost>
我們再為viewPager添加View的時候，需要建立他們的布局文件,在上面的代碼，我建立了4個xml，內容是一樣的，都放了一個ImageView
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@android:id/tabhost"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <TabWidget android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/red" android:layout_weight="9"> </TabWidget> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_content" android:layout_height="wrap_content"> </android.support.v4.view.ViewPager> <TextView android:id="@+id/tab1" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab2" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab3" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <TextView android:id="@+id/tab4" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </FrameLayout> </LinearLayout> </TabHost>
這樣做出來的Demo，首次啟動時會出現無法顯示畫面的問題，只有當點擊一次Tab的時候才會顯示。為了解決這個問題，我在MainActivity的onCreate（）方法的
最后面加入了這兩句話,但是還是不明白，為什么我只 mTabHost.setCurrentTab(0);不起作用，希望知道的的小伙伴各異給我解答一下疑惑,謝謝。
//解決開始時不顯示viewPager mTabHost.setCurrentTab(1); mTabHost.setCurrentTab(0);
下面是效果圖:
