Android ViewPager使用詳解

這是Google官方給我們提供的一個相容低版本安卓裝置的軟體包，裡麵包囊了只有在安卓3.0以上可以使用的api。而viewpager就是其中之一利用它，我們可以做很多事情，從最簡單的導航，到頁面菜單等等。那如何使用它呢，與LisstView類似，我們也需要一個適配器，他就是PagerAdapter。看一下api的圖片，

ViewPager的功能就是可以使視圖滑動，就像Lanucher左右滑動那樣。分三個步驟來使用它：
  1.在住布局檔案裡加入
[html]
view plaincopy

• <android.support.v4.view.ViewPager    這個組件，注意這個組件是用來顯示左右滑動的介面的，如果不載入xml布局檔案，他是不會顯示內容的。  
•         android:id="@+id/viewpager"  
•         android:layout_width="wrap_content"  
•         android:layout_height="wrap_content"  
•         android:layout_gravity="center" >  

2.載入要顯示的頁卡，[java]

view plaincopy

• LayoutInflater lf = getLayoutInflater().from(this);  
•         view1 = lf.inflate(R.layout.layout1, null);  
•         view2 = lf.inflate(R.layout.layout2, null);  
•         view3 = lf.inflate(R.layout.layout3, null);  
•   
•         viewList = new ArrayList();// 將要分頁顯示的View裝入數組中  
•         viewList.add(view1);  
•         viewList.add(view2);  
•         viewList.add(view3);  

3.在Activity裡執行個體化ViewPager組件，並設定它的Adapter（就是PagerAdapter，方法與ListView一樣的），在這裡一般需要重寫PagerAdapter。
[java]
view plaincopy

• PagerAdapter pagerAdapter = new PagerAdapter() {  
•   
•             @Override  
•             public boolean isViewFromObject(View arg0, Object arg1) {  
•   
•                 return arg0 == arg1;  
•             }  
•   
•             @Override  
•             public int getCount() {  
•   
•                 return viewList.size();  
•             }  
•   
•             @Override  
•             public void destroyItem(ViewGroup container, int position,  
•                     Object object) {  
•                 container.removeView(viewList.get(position));  
•   
•             }  
•   
•             @Override  
•             public int getItemPosition(Object object) {  
•   
•                 return super.getItemPosition(object);  
•             }  
•   
•             @Override  
•             public CharSequence getPageTitle(int position) {  
•   
•                 return titleList.get(position);  
•             }  
•   
•             @Override  
•             public Object instantiateItem(ViewGroup container, int position) {  
•                 container.addView(viewList.get(position));  
•                 weibo_button=(Button) findViewById(R.id.button1);  
•                 weibo_button.setOnClickListener(new OnClickListener() {  
•                      
•                     public void onClick(View v) {  
•                         intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);  
•                         startActivity(intent);  
•                     }  
•                 });  
•                 return viewList.get(position);  
•             }  
•   
•         };  
•         viewPager.setAdapter(pagerAdapter);  

  這是重寫PagerAdapter的一個方法，我們還可以這樣做：[java]

view plaincopy

• public class MyViewPagerAdapter extends PagerAdapter{  
•         private List mListViews;  
•          
•         public MyViewPagerAdapter(List mListViews) {  
•             this.mListViews = mListViews;//構造方法，參數是我們的頁卡，這樣比較方便。  
•         }  
•   
•         @Override  
•         public void destroyItem(ViewGroup container, int position, Object object)   {     
•             container.removeView(mListViews.get(position));//刪除頁卡  
•         }  
•   
•   
•         @Override  
•         public Object instantiateItem(ViewGroup container, int position) {  //這個方法用來執行個體化頁卡         
•              container.addView(mListViews.get(position), 0);//添加頁卡  
•              return mListViews.get(position);  
•         }  
•   
•         @Override  
•         public int getCount() {           
•             return  mListViews.size();//返回頁卡的數量  
•         }  
•          
•         @Override  
•         public boolean isViewFromObject(View arg0, Object arg1) {            
•             return arg0==arg1;//官方提示這樣寫  
•         }  
•     }  

  大同小異，有一定很重要，就是我們需要重寫哪些方法。從上面的圖片可以看到，ViewPager的適配器是PagerAdapter，它是基類提供適配器來填充頁面ViewPager內部，你很可能想要使用一個更具體的實現,如FragmentPagerAdapter或FragmentStatePagerAdapter。在這裡需要說明一下，其實ViewPager應該和Fragment一起使用，至少Google官方是這麼想的，但是在3.0之下，我們沒有必要這麼做。下面要注意，當你實現一個PagerAdapter,你必須至少覆蓋以下方法:

• instantiateItem(ViewGroup, int)
• destroyItem(ViewGroup, int, Object)
• getCount()
• isViewFromObject(View, Object)

  從上面的例子中可以看到，我們最少也是實現了上面四個方法，當然如果你想讓程式更健壯或是功能更全面，你可以重寫其他的方法。下面看一下第一個完整的範例程式碼：

  首頁面Activity：
[java]
view plaincopy

• package com.example.viewpagerdemo;  
•   
• import java.util.ArrayList;  
• import java.util.List;  
• import android.os.Bundle;  
• import android.app.Activity;  
• import android.content.Context;  
• import android.content.Intent;  
• import android.support.v4.view.PagerAdapter;  
• import android.support.v4.view.PagerTabStrip;  
• import android.support.v4.view.PagerTitleStrip;  
• import android.support.v4.view.ViewPager;  
• import android.util.AttributeSet;  
• import android.view.LayoutInflater;  
• import android.view.Menu;  
• import android.view.View;  
• import android.view.View.OnClickListener;  
• import android.view.ViewGroup;  
• import android.widget.Button;  
•   
• public class ViewPagerDemo extends Activity {  
•   
•     private View view1, view2, view3;//需要滑動的頁卡  
•     private ViewPager viewPager;//viewpager  
•     private PagerTitleStrip pagerTitleStrip;//viewpager的標題  
•     private PagerTabStrip pagerTabStrip;//一個viewpager的指標，效果就是一個橫的粗的底線  
•     private List viewList;//把需要滑動的頁卡添加到這個list中  
•     private List titleList;//viewpager的標題  
•     private Button weibo_button;//button對象，一會用來進入第二個Viewpager的樣本  
•    private Intent intent;  
•     @Override  
•     public void onCreate(Bundle savedInstanceState) {  
•         super.onCreate(savedInstanceState);  
•         setContentView(R.layout.activity_view_pager_demo);  
•         initView();  
•     }  
•       /*在這裡需要說明一下，在上面的圖片中我們看到了，PagerTabStrip，PagerTitleStrip，他們其實是viewpager的一個指標，前者效果就是一個橫的粗的底線，後者用來顯示各個頁卡的標題，當然而這也可以共存。在使用他們的時候需要注意，看下面的布局檔案，要在android.support.v4.view.ViewPager裡面添加
• android.support.v4.view.PagerTabStrip以及android.support.v4.view.PagerTitleStrip。
•     private void initView() {
•         viewPager = (ViewPager) findViewById(R.id.viewpager);
•         //pagerTitleStrip = (PagerTitleStrip) findViewById(R.id.pagertitle);
•         pagerTabStrip=(PagerTabStrip) findViewById(R.id.pagertab);
•         pagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.gold));  
•         pagerTabStrip.setDrawFullUnderline(false);
•         pagerTabStrip.setBackgroundColor(getResources().getColor(R.color.azure));
•         pagerTabStrip.setTextSpacing(50);
•         /*
•         weibo_button=(Button) findViewById(R.id.button1);
•         weibo_button.setOnClickListener(new OnClickListener() {
•             
•             public void onClick(View v) {
•                 intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);
•                 startActivity(intent);
•             }
•         });
•         */  
•          
•         view1 = findViewById(R.layout.layout1);  
•         view2 = findViewById(R.layout.layout2);  
•         view3 = findViewById(R.layout.layout3);  
•   
•         LayoutInflater lf = getLayoutInflater().from(this);  
•         view1 = lf.inflate(R.layout.layout1, null);  
•         view2 = lf.inflate(R.layout.layout2, null);  
•         view3 = lf.inflate(R.layout.layout3, null);  
•   
•         viewList = new ArrayList();// 將要分頁顯示的View裝入數組中  
•         viewList.add(view1);  
•         viewList.add(view2);  
•         viewList.add(view3);  
•   
•         titleList = new ArrayList();// 每個頁面的Title資料  
•         titleList.add("wp");  
•         titleList.add("jy");  
•         titleList.add("jh");  
•   
•         PagerAdapter pagerAdapter = new PagerAdapter() {  
•   
•             @Override  
•             public boolean isViewFromObject(View arg0, Object arg1) {  
•   
•                 return arg0 == arg1;  
•             }  
•   
•             @Override  
•             public int getCount() {  
•   
•                 return viewList.size();  
•             }  
•   
•             @Override  
•             public void destroyItem(ViewGroup container, int position,  
•                     Object object) {  
•                 container.removeView(viewList.get(position));  
•   
•             }  
•   
•             @Override  
•             public int getItemPosition(Object object) {  
•   
•                 return super.getItemPosition(object);  
•             }  
•   
•             @Override  
•             public CharSequence getPageTitle(int position) {  
•   
•                 return titleList.get(position);//直接用適配器來完成標題的顯示，所以從上面可以看到，我們沒有使用PagerTitleStrip。當然你可以使用。  
•   
•             }  
•   
•             @Override  
•             public Object instantiateItem(ViewGroup container, int position) {  
•                 container.addView(viewList.get(position));  
•                 weibo_button=(Button) findViewById(R.id.button1);//這個需要注意，我們是在重寫adapter裡面執行個體化button組件的，如果你在onCreate()方法裡這樣做會報錯的。  
•                 weibo_button.setOnClickListener(new OnClickListener() {  
•                      
•                     public void onClick(View v) {  
•                         intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);  
•                         startActivity(intent);  
•                     }  
•                 });  
•                 return viewList.get(position);  
•             }  
•   
•         };  
•         viewPager.setAdapter(pagerAdapter);  
•     }  
•   
•     @Override  
•     public boolean onCreateOptionsMenu(Menu menu) {  
•         getMenuInflater().inflate(R.menu.activity_view_pager_demo, menu);  
•         return true;  
•     }  
•   
• }  

  它的布局檔案：
[java]
view plaincopy

•   
•     android:layout_width="fill_parent"  
•     android:layout_height="fill_parent"  
•     androidrientation="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:id="@+id/pagertab"   
•             android:layout_width="wrap_content"   
•             android:layout_height="wrap_content"   
•             android:layout_gravity="top"/>   
•            
•       
•   
•   
•   
• lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
•    android:layout_width="fill_parent"  
•    android:layout_height="fill_parent"  
•    androidrientation="vertical" >  
•   
•    <linearlayout  
•        android:id="@+id/linearLayout1"  
•        android:layout_width="fill_parent"  
•        android:layout_height="40.0dip"  
•        android:background="#FFFFFF" >  
•   
•        <textview  
•            android:id="@+id/text1"  
•            android:layout_width="fill_parent"  
•            android:layout_height="fill_parent"  
•            android:layout_weight="1.0"  
•            android:gravity="center"  
•            android:text=" @我"  
•            android:textColor="#000000"  
•            android:textSize="20.0dip" />  
•   
•        <textview  
•            android:id="@+id/text2"  
•            android:layout_width="fill_parent"  
•            android:layout_height="fill_parent"  
•            android:layout_weight="1.0"  
•            android:gravity="center"  
•            android:text="評論"  
•            android:textColor="#000000"  
•            android:textSize="20.0dip" />  
•   
•        <textview  
•            android:id="@+id/text3"  
•            android:layout_width="fill_parent"  
•            android:layout_height="fill_parent"  
•            android:layout_weight="1.0"  
•            android:gravity="center"  
•            android:text="私信"  
•            android:textColor="#000000"  
•            android:textSize="20.0dip" />  
•      
•   
•    <imageview  
•        android:id="@+id/cursor"  
•        android:layout_width="fill_parent"  
•        android:layout_height="wrap_content"  
•        android:scaleType="matrix"  
•        android:src="@drawable/a" />  
•   
•    <android.support.v4.view.viewpager  
•        android:id="@+id/vPager"  
•        android:layout_width="wrap_content"  
•        android:layout_height="0dp"  
•        android:layout_gravity="center"  
•        android:layout_weight="1.0"  
•        android:background="#000000"  
•        android:flipInterval="30"  
•        android:persistentDrawingCache="animation" />  
• lt;/LinearLayout>  

  效果如下：

  所以總結一下，我們可以使用ViewPager做什麼：
1.程式使用導航，外加底部圓點的效果，這個在樣本裡介紹了
2.頁卡滑動，加上菜單的效果，不管是之前的支援手勢也支援底部表徵圖點擊的，還是今天的微博。
轉自csdn