android 中 ViewPager 的日常用法 ViewPager+ Views

延續前面幾個的常常用到的ViewPager， 直接加載各類不一樣的 View

工程目錄：

代碼：

 

public class ViewActivity extends Activity {

	// 每一個View的圖片
	private int[] images = { R.drawable.guide_1,R.drawable.guide_3, 
			R.drawable.guide_5,  R.drawable.guide_6, R.drawable.guide_7 };
	//全部的View		
	private List<View> list_views = new ArrayList<View>();
	
	private ViewPager pager;
	private ImageView start;      
	private ImageView curDot;
	
	private LinearLayout  linear_all_point; // 指示器圖標view
	private int offset;              // 位移量
	
	private int nowPosition;          // 記錄當前的位置
	private GuidePagerAdapter adapter;
	
	Handler handler = new Handler() {
		@Override
		public void handleMessage(Message msg) {
			switch (msg.what) {
			case 0:
				start.setVisibility(View.VISIBLE);
				break;
            case 1:
            	start.setVisibility(View.GONE);
				break;
			}
		}
	};
	
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.main);
		init();
	}
	
	private ImageView buildImageView(int id){
		ImageView iv = new ImageView(this);
		iv.setImageResource(id);
		ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(
				ViewGroup.LayoutParams.FILL_PARENT,
				ViewGroup.LayoutParams.FILL_PARENT);
		iv.setLayoutParams(params);
		iv.setScaleType(ScaleType.FIT_XY);
		return iv;
	}
	
		
	//功能介紹界面的初始化
	private void init(){
		
		{
			linear_all_point = (LinearLayout)this.findViewById(R.id.dot_contain);
			pager = (ViewPager) findViewById(R.id.contentPager);
			curDot = (ImageView) findViewById(R.id.cur_dot);
			start = (ImageView) findViewById(R.id.open);

		}
		
		
		{ //初始化點 每一個底部小點的指示器哦。 
			for(int i=0; i< images.length; i++){
				ImageView dotView = new ImageView(this);
				dotView.setImageResource(R.drawable.dot1_w);
				dotView.setLayoutParams(new LinearLayout.LayoutParams(
						ViewGroup.LayoutParams.WRAP_CONTENT,
						ViewGroup.LayoutParams.WRAP_CONTENT,1.0f));
				linear_all_point.addView(dotView);
			}
		}

		
			ImageView imageView;
			//如今的viewpager我往裏面塞的是圖片，這裏你也能夠初始化你本身的xml
			for (int i = 0; i < images.length; i++) {
				imageView = buildImageView(images[i]);
				list_views.add(imageView);
			}

		    //當curDot的所在的樹形層次將要被繪出時此方法被調用
		    curDot.getViewTreeObserver().addOnPreDrawListener(
				new OnPreDrawListener() {
					public boolean onPreDraw() {
						// 獲取ImageView的寬度也就是點圖片的寬度
						offset = curDot.getWidth();
						return true;
					}
			});
		    
		    adapter = new GuidePagerAdapter(list_views);
			// ViewPager設置數據適配器，這個相似於使用ListView時用的adapter
			pager.setAdapter(adapter);
			pager.clearAnimation();
			// 爲Viewpager添加事件監聽器 OnPageChangeListener
			pager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener(){
				@Override
				public void onPageSelected(int position){
					//移動下面的小點指示器
					moveCursorTo(position);
					if (position == images.length-1) {// 到最後一張了					
						handler.sendEmptyMessageDelayed(0, 500);					
						
					} else if (nowPosition == images.length - 1) {
						handler.sendEmptyMessageDelayed(1, 100);
					}
					
					nowPosition = position;
					super.onPageSelected(position);
				}
			});
	}
	
	//指示器
	private void moveCursorTo(int position) {
		AnimationSet animationSet = new AnimationSet(true);
		TranslateAnimation tAnim = new TranslateAnimation(offset* nowPosition, offset * position, 0, 0);
		animationSet.addAnimation(tAnim);
		animationSet.setDuration(10);
		animationSet.setFillAfter(true);
		curDot.startAnimation(animationSet);
	}

	// ViewPager 適配器
	class GuidePagerAdapter extends PagerAdapter{
		private List<View> views;
		public GuidePagerAdapter(List<View> views){
			this.views=views;
		}
		@Override
		public void destroyItem(View arg0, int position, Object arg2) {
			((ViewPager) arg0).removeView(views.get(position));
		}
		@Override
		public void finishUpdate(View arg0) {
		}
		@Override
		public int getCount() {
			return views.size();
		}
		@Override
		public Object instantiateItem(View arg0, int position) {
			((ViewPager) arg0).addView(views.get(position),0);
			return views.get(position );
		}

		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {
			return arg0 == (arg1);
		}

		@Override
		public void restoreState(Parcelable arg0, ClassLoader arg1) {
		}

		@Override
		public Parcelable saveState(){
			return null;
		}

		@Override
		public void startUpdate(View arg0){	
			
		}
	}
	
}

xml 文件

 

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/contentPager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center"
        android:flipInterval="30"
        android:persistentDrawingCache="animation" />

    
    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:gravity="center" 
        android:layout_marginBottom="22.0dip">
        <LinearLayout
            android:id="@+id/dot_contain"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal" >           
        </LinearLayout>

        <ImageView
            android:id="@+id/cur_dot"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dot2_w" />
    </FrameLayout>

    <ImageView
        android:id="@+id/open"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:clickable="true"
        android:src="@drawable/ic_open"
        android:visibility="gone" />

</RelativeLayout>

圖片什麼的都本身找吧，老早之前的代碼了= =，