Android開發之ViewPager滑動頁面效果實現

       我們先來Google官方文檔對viewpager的介紹，該類允許使用者通過頁面翻轉左右的資料，需要通過實現PagerAdapter適配器來產生視圖顯示的頁面。因為注意這個類是早期設計和開發的，API可能會改變，並在以後更新相容庫,到時候我們需要做相應的處理。ViewPager最常用於結合Fragment,這是一個方便的方式來供應和管理每個頁面的生命週期,我們後面的部落格介紹相關的內容，今天我們先來簡單實現viewpager的功能。

MainAcitivity的代碼

package com.example.f10_viewpager;import java.util.ArrayList;import java.util.List;import android.os.Bundle;import android.app.Activity;import android.support.v4.view.PagerAdapter;import android.support.v4.view.PagerTabStrip;import android.support.v4.view.ViewPager;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class MainActivity extends Activity {private View view1, view2, view3;// 需要滑動的頁卡private ViewPager viewPager;private PagerTabStrip pagerTabStrip;private List<View> viewList;// 把需要滑動的頁卡添加到這個list中private List<String> titleList;// viewpager的標題@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);// 像普通控制項一樣先初始化viewPager = (ViewPager) findViewById(R.id.viewpager);pagerTabStrip = (PagerTabStrip) findViewById(R.id.pagertab);pagerTabStrip.setDrawFullUnderline(false);//設定底線不整頁顯示pagerTabStrip.setTextSpacing(1000);//設定標題之間的距離initView();MyAdapter pagerAdapter = new MyAdapter();viewPager.setAdapter(pagerAdapter);}    //填充布局，設定每一頁的標題private void initView() {view1 = findViewById(R.layout.layout1);view2 = findViewById(R.layout.layout2);view3 = findViewById(R.layout.layout3);viewList = new ArrayList<View>();// 將要分頁顯示的View裝入數組中viewList.add(view1);viewList.add(view2);viewList.add(view3);titleList = new ArrayList<String>();// 每個頁面的Title資料titleList.add("第一個頁面");titleList.add("第二個頁面");titleList.add("第三個頁面");}public class MyAdapter extends PagerAdapter {@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic int getCount() {return viewList.size();}@Overridepublic void destroyItem(ViewGroup container, int position, Object object) {container.removeView(viewList.get(position));}@Overridepublic int getItemPosition(Object object) {return super.getItemPosition(object);}@Overridepublic CharSequence getPageTitle(int position) {return titleList.get(position);}// 將每一頁的布局填充如ViewGroup容器中@Overridepublic Object instantiateItem(ViewGroup container, int position) {container.addView(viewList.get(position));return viewList.get(position);}};}

   在我之間瀏覽博文的時候，有人提到過第30行代碼設定標題的距離效果沒有實現，不知道為什麼，後來我調試了一下，發現應該是這個值要設定的大一些，我這裡設定的就是1000就實現了一個頁面只顯示一個標題的效果。在layout布局檔案下，我們首先得先建立三個簡單的布局檔案，來實現滑動效果，當然最重要的是main.xml的代碼書寫

<?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"      android:layout_width="fill_parent"      android:layout_height="fill_parent"      android:orientation="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"/>                                                           </android.support.v4.view.ViewPager>    </LinearLayout>