android 初識ViewPager

1.準備工作


每一個view，只是img不一樣，其他都是一樣的

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ImageView 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"
        //這裏寫每一頁想要顯示的圖片
        android:src="@drawable/image1"
        android:scaleType="fitCenter"        
        />
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center"
        android:text="向左滑動下一張"
        android:textColor="#f0f0f0"/>

</FrameLayout>

2.主佈局。xml

<LinearLayout 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"
    tools:context=".MainActivity" >
//這裏要做兼容
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        //這裏這得是引導欄
        <android.support.v4.view.PagerTabStrip
            android:id="@+id/tab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
            >

        </android.support.v4.view.PagerTabStrip>

    </android.support.v4.view.ViewPager>

</LinearLayout>

3.activity.java裏面的代碼

public class MainActivity extends Activity {

    private ViewPager pager;
    //定義一個泛型用於存儲每一個view
    private List<View>viewlist;
    private PagerTabStrip tab;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //初始化
        viewlist = new ArrayList<View>();
        pager =(ViewPager) findViewById(R.id.pager);
        tab = (PagerTabStrip)findViewById(R.id.tab);
        //將每一個xml佈局文件轉化爲view
       View view1 = View.inflate(this, R.layout.view1, null);
       View view2 = View.inflate(this, R.layout.view2, null);
       View view3 = View.inflate(this, R.layout.view3, null);
       View view4 = View.inflate(this, R.layout.view4, null);
       //把view放進數組空間裏面
       viewlist.add(view1);
       viewlist.add(view2);
       viewlist.add(view3);
       viewlist.add(view4);       
        //設置引導欄的屬性，更多請查閱api
       tab.setBackgroundColor(Color.BLACK);
       tab.setTextColor(Color.WHITE);
       tab.setDrawFullUnderline(false);
       tab.setTabIndicatorColor(Color.WHITE);
       //這裏面是viewpager的適配器
       MyPagerAdapter adapter = new MyPagerAdapter(viewlist);    
       //設置轉換動畫，也可以不設置轉換動畫，那樣切換的效果就很死板
  pager.setPageTransformer(true, new DepthPageTransformer());
       //這是另外一個不同效果的轉換動畫
    //pager.setPageTransformer(true, new ZoomOutPageTransformer());
       pager.setAdapter(adapter);       
    }
}

4.viewpager的適配器，這裏沒有什麼要註明的，相應的參數都記住怎麼填的就行了，如果要設置title則加個getPageTitle方法，定義一個titlelist，把每一頁的title寫進list裏面

public class MyPagerAdapter extends PagerAdapter{

    private List<View>viewlist;

    public MyPagerAdapter(List<View>viewlist){
        this.viewlist=viewlist;
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return viewlist.size();
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        // TODO Auto-generated method stub
        return arg0==arg1;
    }
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        // TODO Auto-generated method stub
        container.addView(viewlist.get(position));
        return viewlist.get(position);
    }
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        // TODO Auto-generated method stub
        container.removeView(viewlist.get(position));
    }

}

原理：
將xml文件轉換爲view放進list泛型裏面，用pageradapter適配器綁定viewlist數據源呈現出來，想要加動畫就setPageTransformer參數第一個是true，第二個是一個動畫類，api中也可以查到一個是DepthPageTransformer，一個是ZoomOutPageTransformer