Android ViewPager

一、ViewPager簡單介紹

素材和參考文章:http://blog.csdn.net/xiaanming/article/details/8966621

ViewPager在應用中使用的非常廣泛,也是一個AdapterView在使用在需要使用適配器PagerAdapter。ViewPager在更新的時候使用了回調刪除的機制。ViewPager將每一個頁面與一個關鍵對象Object相關聯,而不是直接使用其中的view對象;一般簡單實現時,使用page Views作爲關鍵對象key Object,從instantiateItem方法中返回的值。

在實現PagerAdapter適配器時都有重現其中的四個方法:

PagerAdapter最多會保存3個page view的引用,初始化先保存2個,當向左划動一次,這時才添加第三個。再向左滑到時,會先刪除對第一個的引用,然後添加向後一個的引用。當我們向右邊滑到查看前面一個的時候,會先添加對第一個的引用,然後刪除最後一個的引用。以達到只保存三個引用的效果。

3張圖片循環報錯的情況:

所以但我們只有3張圖片時要實現循環滾動,如果一直是向左邊滑動這是沒有問題的。但是如果向右滑動查看前面一張圖片的時候會報錯。java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first.因爲這時要先添加後刪除,但是添加上去的view這時已經是有parent的。所以我們需要先進行手動刪除,詳細見代碼部分。如果只有兩張的情況下,繼續使用這種方法會先出現空白在出圖片,效果不好。只有兩張,建議去掉循環功能;

/**
 * 素材和參考文章:http://blog.csdn.net/xiaanming/article/details/8966621
 * 官網上的viewPage類介紹:http://developer.android.com/reference/android/support/v4/view/ViewPager.html
 * PagerAdapter:http://developer.android.com/reference/android/support/v4/view/PagerAdapter.html
 */
import com.sjc.myproject.R;


import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;

public class SjcViewPageActivity extends Activity implements OnPageChangeListener{
	private ViewPager viewPage;
	
	// 裝ImageView數組 
    private ImageView[] mImageViews;  
    // 圖片資源id 
    private int[] imgIdArray ; 
    
    //圖片位置提示
    private ImageView[] tips;  
    
    private int currentSelectedIndex;
    
    private LinearLayout viewGroup;
	
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_viewpage);
		initData();
		viewPage = (ViewPager) findViewById(R.id.viewpage);
		viewGroup = (LinearLayout) findViewById(R.id.viewGroup);
		
		
		
		setIndicator();
		viewPage.setAdapter(new MyAdapter());
		viewPage.setOnPageChangeListener(this);
	}
	
	private void initData() {
		currentSelectedIndex = 0;
		
		imgIdArray = new int[]{R.drawable.item01, R.drawable.item02, R.drawable.item03,
				R.drawable.item04, R.drawable.item05, R.drawable.item06, R.drawable.item07, R.drawable.item08};
		
		mImageViews = new ImageView[imgIdArray.length];
		for(int i=0,  length = imgIdArray.length; i<length; i++) {
			ImageView imageView = new ImageView(this);
			imageView.setBackgroundResource(imgIdArray[i]);
			mImageViews[i] = imageView;
		}
		
		tips = new ImageView[imgIdArray.length]; 
		for(int i=0,  length = imgIdArray.length; i<length; i++) {
			ImageView imageView = new ImageView(this); 
			tips[i] = imageView; 
			
			if(i == currentSelectedIndex){  
                tips[i].setBackgroundResource(R.drawable.page_indicator_focused);  
            }else{  
                tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);  
            }  
			
			
		}
	}
	
	//設置位置指示
	private void setIndicator() {
		LayoutParams layoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);  
		layoutParams.leftMargin = 10;
		layoutParams.rightMargin = 10;
		for(int i =0, length = tips.length; i<length; i++) {
			
			viewGroup.addView(tips[i], layoutParams);
		}
	}
	
	private void exchangeIndecator(int selecteIndex) {
		tips[currentSelectedIndex].setBackgroundResource(R.drawable.page_indicator_unfocused);
		tips[selecteIndex].setBackgroundResource(R.drawable.page_indicator_focused);
		currentSelectedIndex = selecteIndex;
	}
	
	//PagerAdapter=============================
	class MyAdapter extends PagerAdapter{

		//返回ViewPager可以顯示的總數,如果大於這個數,這ViewPager不會調用相關的方法進行顯示,
		//會多次調用,
		//一般如果不需要進行界面的循環顯示,則返回實際的顯示數量如:return imgIdArray.length;就不會出現從最後一張返回第一張的功能。
		public int getCount() {
			//Log.d("TAG", "MyAdapter --> getCount");
			if(mImageViews.length <= 2) {
				return mImageViews.length;
			}
			return Integer.MAX_VALUE; 
		}

		//用來確定一個界面是否於instantiateItem()返回的key Object相關聯
		//只有返回值爲true時,纔會顯示界面
		public boolean isViewFromObject(View arg0, Object arg1) {
			//Log.v("TAG", "MyAdapter --> isViewFromObject");
			return arg0 == arg1;
		}
		
		//刪除view page界面
		//container 包含viewpage 的容器
		//position:需要刪除的viewpage 的位置
		//object:從instantiateItem(View container, int position)返回的對象
		public void destroyItem(View container, int position, Object object) {
			if(mImageViews.length > 3) {
				Log.e("TAG", "MyAdapter --> destroyItem position = " + position% mImageViews.length);
				//爲了你能循環顯示mImageViews[position % mImageViews.length]
				((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
			}
			
		}
		//爲給定的位置創建viewpage
		public Object instantiateItem(View container, int position) {
			Log.i("TAG", "MyAdapter --> instantiateItem position = " + position% mImageViews.length);
			if(mImageViews[position % mImageViews.length].getParent() != null) {
				((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
			}
			
			((ViewPager)container).addView(mImageViews[position % mImageViews.length], 0);
			
			return mImageViews[position % mImageViews.length];
		}

	}

	
	//OnPageChangeListener============
	//滾動狀態發生改變時會調用此方法
	//參數state:代表滾動的狀態;
	//有三個常量來定義滾動狀態: SCROLL_STATE_IDLE 0、SCROLL_STATE_DRAGGING 1、SCROLL_STATE_SETTLING 2
	//0:無滾動閒置狀態
	//1:用戶正在開始拖拽界面
	//2:界面正在進行調整其已經確定的最終位置
	public void onPageScrollStateChanged(int state) {
		//Log.i("TAG", "onPageScrollStateChanged --> state = " + state);
	}

	//初始化的時候會調用一次,ViewPager有滾動時調用
	//position:當前顯示界面的index,position+1將會是下一個要顯示的界面
	//positionOffset:取值範圍[0,1),說明當前頁面位置的偏移,相對於左下標點,往左滾動時數值增到,到達1時,界面換成下一個。
	//positionOffsetPixels:像素值指示位置的偏移量,相對於右下標點
	public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
		//Log.v("TAG", "onPageScrolled --> position = " + position + ", positionOffset = " + positionOffset + ", positionOffsetPixels = " + positionOffsetPixels);
	}

	//新界面被選定時調用此方法
	//position:當前被選中界面的index
	public void onPageSelected(int position) {
		//Log.w("TAG", "onPageSelected --> arg0 = " + position);
		exchangeIndecator(position % imgIdArray.length);
	}
}
佈局文件activity_viewpage.xml:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpage"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    
    <LinearLayout
        android:id="@+id/viewGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_gravity="bottom"
        android:paddingBottom="30dp"
        android:gravity="center_horizontal"
        >
        
    </LinearLayout>

</FrameLayout>


ViewPager的運用十分廣泛,這只是最基本的知識點,內容是在原作者的基礎之上添加的,效果及素材及源碼請移步原作者文章。

新的內容會陸續添加。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章