Android教程網
設為首頁|加入收藏
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android ViewPager 的使用總結

Android ViewPager 的使用總結

編輯：關於Android編程

在一個窗口裡面添加tab便簽，完成便簽切換來實現頁面的切換，這樣的好處是可以在同一個窗口裡面有多個頁面，這些頁面共享同一個窗口的資源，同使用多個窗口來實現這個功能來得更加流暢！！

主要產生的類文件有activity，n個view，adapter，自定義的ViewPager，n+1個布局文件

demo所用到文件

步驟：

創建activity

package com.example.myviewpager;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;
/**
 * 主窗口
 * @author cgx
 *
 */
public class MainActivity extends Activity implements OnClickListener {

 private Context mContext;
 private MyViewPager mPager;// 頁面內容
 private MyViewPagerAdapter pagerAdapter = null;
 private TextView t1, t2, t3;// 頁卡頭標
 private List<View> pageList = new ArrayList<View>();
 private View1 mView1;
 private View2 mView2;
 private View3 mView3;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 mContext = this;
 initViews();
 initEvents();
 initViewPager();
 }

 private void initViews() {
 // TODO Auto-generated method stub
 
 t1 = (TextView) findViewById(R.id.text1);
 t2 = (TextView) findViewById(R.id.text2);
 t3 = (TextView) findViewById(R.id.text3);
 mPager = (MyViewPager) findViewById(R.id.vPager);
 // 設置ViewPager不允許滑動
 //mPager.setCanScroll(false);
 //一開始進入窗口的時候，默認第一個便簽被選中
 t1.setBackgroundColor(Color.parseColor("#FFFF00"));
 t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
 t3.setBackgroundColor(Color.parseColor("#FFFFFF"));
 }

 private void initEvents() {
 // TODO Auto-generated method stub
 t1.setOnClickListener(this);
 t2.setOnClickListener(this);
 t3.setOnClickListener(this);
 }

 private void initViewPager() {
 // TODO Auto-generated method stub

 pageList.clear();

 if (mView1 == null) {
  mView1 = new View1(mContext);
 }

 if (mView2 == null) {
  mView2 = new View2(mContext);
 }

 if (mView3 == null) {
  mView3 = new View3(mContext);
 }

 pageList.add(mView1.getView());
 pageList.add(mView2.getView());
 pageList.add(mView3.getView());

 pagerAdapter = new MyViewPagerAdapter(pageList);
 // 緩存頁面，如果想全部都緩存的話，參數等於頁卡數減一,系統默認參數為1，保存兩個
 mPager.setOffscreenPageLimit(2);
 mPager.setAdapter(pagerAdapter);
 // 設置Page改變監聽器
 mPager.setOnPageChangeListener(onPageChangeListener);
 }

 /**
 * SimpleOnPageChangeListener.該監聽是當我們的viewpager頁面切換的時候會觸發 在裡面我們會去改變 tab的聚焦情況
 * 。 因為實現上viewpager與actionbar是獨立的，需要我們手動同步 。
 */
 ViewPager.SimpleOnPageChangeListener onPageChangeListener = new ViewPager.SimpleOnPageChangeListener() {
 @Override
 public void onPageSelected(int position) {
  /**
  * setSelectedNavigationItem 方法用於設置ActionBar的聚焦tab .
  * 在接下來我們判斷了SLidingMenu的手勢力模式， 如果ViewPager已經滑到了最左邊，則我們把手勢設置成全屏的，
  * 這樣更往左滑動的時候，就會打開Menu .
  */
  initTab(position);
 }

 // 初始化便簽顏色
 private void initTab(int position) {
  // TODO Auto-generated method stub
  if (position == 0) {
  t1.setBackgroundColor(Color.parseColor("#FFFF00"));
  t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
  t3.setBackgroundColor(Color.parseColor("#FFFFFF"));

  } else if (position == 1) {
  t1.setBackgroundColor(Color.parseColor("#FFFFFF"));
  t2.setBackgroundColor(Color.parseColor("#FFFF00"));
  t3.setBackgroundColor(Color.parseColor("#FFFFFF"));
  } else {
  t1.setBackgroundColor(Color.parseColor("#FFFFFF"));
  t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
  t3.setBackgroundColor(Color.parseColor("#FFFF00"));
  }
 }
 };

 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 switch (v.getId()) {

 case R.id.text1:// 點擊第一個便簽
  mPager.setCurrentItem(0, false);
  break;
 case R.id.text2:// 點擊第二個便簽
  mPager.setCurrentItem(1, false);
  break;
 case R.id.text3:// 點擊第三個便簽
  mPager.setCurrentItem(2, false);
  break;
 default:
  break;
 }
 }

}

自定義MyViewPager

package com.example.myviewpager;

import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.MotionEvent;

/**
 * 自定義滑動翻頁可控，可通過設置isCanScroll參數來控制是否允許滑動切換頁面
 */
public class MyViewPager extends ViewPager {
 /** 是否允許滑動翻頁 ,默認可滑動*/
 private boolean isCanScroll = true;

 public MyViewPager(Context context, AttributeSet attrs) {
 super(context, attrs);
 }

 public MyViewPager(Context context) {
 super(context);
 }

 public boolean isCanScroll() {
 return isCanScroll;
 }

 /** 設置是否可以滑動翻頁 */
 public void setCanScroll(boolean isCanScroll) {
 this.isCanScroll = isCanScroll;
 }

 @Override
 public void scrollTo(int x, int y) {
 super.scrollTo(x, y);
 }

 // 設置禁止滑動的關鍵
 @Override
 public boolean onTouchEvent(MotionEvent arg0) {
 if (!isCanScroll)
  return true;
 return super.onTouchEvent(arg0);
 }

 @Override
 public boolean onInterceptTouchEvent(MotionEvent arg0) {

 return super.onInterceptTouchEvent(arg0);
 }

 @Override
 public void setCurrentItem(int item, boolean smoothScroll) {
 super.setCurrentItem(item, smoothScroll);
 }

 @Override
 public void setCurrentItem(int item) {
 super.setCurrentItem(item);
 }

}

適配器：

package com.example.myviewpager;

import java.util.List;

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
/**
 * viewpager適配器
 * */
public class MyViewPagerAdapter extends PagerAdapter{

 
  private List<View> mListViews; 
  
  public MyViewPagerAdapter(List<View> 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;//官方提示這樣寫
  }

}

第一個view

package com.example.myviewpager;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;

/**
 * 第一個
 * @author cgx
 *
 */
public class View1 {

 private Context mContext;
 private View rootView;
 public View1(Context mContext) {
 // TODO Auto-generated constructor stub
 this.mContext=mContext;
 //加載布局
 rootView = LayoutInflater.from(mContext).inflate(
  R.layout.view1_layout, null);
 }
 
 public View getView(){
 return rootView;
 }
 
}

activity布局文件

<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"
  android:orientation="vertical"
  >
 <LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    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="頁卡1"
      android:textColor="#000000"
      android:textSize="20sp" />

    <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="頁卡2"
      android:textColor="#000000"
      android:textSize="20sp" />

    <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="頁卡3"
      android:textColor="#000000"
      android:textSize="20sp" />
  </LinearLayout>
   <com.example.myviewpager.MyViewPager
    android:id="@+id/vPager"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_weight="1.0"
    android:background="#000000"
    android:flipInterval="30"
     />
 

</LinearLayout>

View1的布局

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

由於用於演示，所以view的布局只是用不同的背景色來區分，開發中具體要展示的布局可以直接在view的布局文件裡面改。demo中的view都是參考第一個來寫的，類似

總結。

實際開發中，雖然官方提供了很多api，真正等到要自己用的時候，還是自己在依照習慣再包裝一層，成為自己的工具，這樣以後就可以直接用了，上面的例子是我在實習期間總結的，鄙陋之處敬請原諒，也歡迎大家指出，一起學習(^_^)

代碼鏈接：http://pan.baidu.com/s/1pJAF6Gz

以上就是對Android ViewPager 的資料整理，後續繼續補充相關資料，謝謝大家對本站的支持！

  1. 上一頁:
  2. 下一頁:
關於Android編程
Android編程入門Android技術基礎Android資訊關於Android編程Android開發Android開發環境Android開發實例
相關文章
熱門文章
Android建立能與Activity進行相互通信的本地服務 解決Android ListView數據為空及加載錯誤的方法 android控件開發之SeekBar Android Content Provider Tutorial--安卓內容提供者系列2--內容提供者用法 【Android】Android自定義帶board的圓角控件 android nfc中MifareClassic格式的讀寫
Android 攜程動態加載框架的打包流程分析

最近攜程開源了一套動態加載的框架，總的來說，該框架和OpenAtlas還
Android 抽屜效果的導航菜單實現代碼實例

看了很多應用，覺得這種側滑的抽屜效果的菜單很好。不用切換到另一個頁面，也
Android 代碼實現preference組件

Preference主要實現一些配置數據，一些我們上次點擊
Android EditText詳解及示例代碼

   　EditText在API中的結構　　java
閱讀排行版
Copyright © Android教程網 All Rights Reserved