android Tab和ViewPager结合的例子

package com.test.activity;

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

import android.app.Activity;
import android.graphics.Matrix;
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.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

import com.test.R;

public class TabActivity extends Activity {

	private ViewPager viewPager;// 可滑动的页卡内容,也就是我们主要练习的目标
	private ImageView imageView;// 类似游标的动画图片,这个就是那个左右滑动的小滑块
	private TextView textView1, textView2, textView3;
	private List<View> views;// 页面列表
	private int offset = 0;// 游标移动的偏移量
	private int currentIndex = 0;// 当前页面号码
	private int bmpW;// 游标宽度
	private View view1, view2, view3;// 各个页面卡片

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab);
		InitImageView();
		InitTextView();
		InitViewPager();
	}
	@SuppressWarnings("all")
	private void InitViewPager() {
		viewPager = (ViewPager) findViewById(R.id.vPager);
		views = new ArrayList<View>();
		LayoutInflater inflater = getLayoutInflater();// 这个在我前面写的几篇里面有介绍Inflater
		view1 = inflater.inflate(R.layout.lay1, null);
		view2 = inflater.inflate(R.layout.lay2, null);
		view3 = inflater.inflate(R.layout.lay3, null);
		views.add(view1);
		views.add(view2);
		views.add(view3);
		// ViewPager跟ListView一样,也需要一个适配器,后面对PagerAdapter进行重写
		viewPager.setAdapter(new MyViewPagerAdapter(views));
		// 默认显示第一个卡片页
		viewPager.setCurrentItem(0);
		// 给ViewPager加监听器
		viewPager.setOnPageChangeListener(new MyOnPageChangeListener());
	}

	private void InitTextView() {
		textView1 = (TextView) findViewById(R.id.tt1);
		textView2 = (TextView) findViewById(R.id.tt2);
		textView3 = (TextView) findViewById(R.id.tt3);
		textView1.setOnClickListener(new MyOnClickLis(0));
		textView2.setOnClickListener(new MyOnClickLis(1));
		textView3.setOnClickListener(new MyOnClickLis(2));// 这些监听器保证在点击头部的标签时候页面也能滑动
	}

	private void InitImageView() {
		imageView = (ImageView) findViewById(R.id.cursor);
		bmpW = imageView.getWidth();
		DisplayMetrics displayMetrics = new DisplayMetrics();
		getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
		int screen = displayMetrics.widthPixels;
		// 这个地方就是给每个标签左右各留出一块offset,共3个标签,6个offset,
		offset = (screen - bmpW * 40) / 6;
		Matrix matrix = new Matrix();
		// 向右平移
		matrix.postTranslate(offset, 0);
		// 对图片进行平移操作
		imageView.setImageMatrix(matrix);
	}

	private class MyOnClickLis implements OnClickListener {
		private int index;

		public MyOnClickLis(int index) {// 注意,这里的监听器有一个默认的带参数的构造器,用来确定你点击的是哪一个标签
			this.index = index;
		}

		@Override
		public void onClick(View v) {
			viewPager.setCurrentItem(index);
		}
	}

	// 下面是比较重点的了,就是之前提到过的重写PagerAdapter,重写时候我们至少需要重写一下4个方法,当然这里我们也只写了这4个方法.
	public class MyViewPagerAdapter extends PagerAdapter {
		private List<View> mListView;

		public MyViewPagerAdapter(List<View> views) {
			this.mListView = views;
		}

		@Override
		public void destroyItem(ViewGroup container, int position, Object object) {
			container.removeView(mListView.get(position));
		}

		@Override
		public Object instantiateItem(ViewGroup container, int position) {
			container.addView(mListView.get(position));
			return mListView.get(position);
		}

		@Override
		public int getCount() {
			return mListView.size();
		}

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

	}

	public class MyOnPageChangeListener implements OnPageChangeListener {
		int one = offset * 2 + bmpW;// 卡片1 --> 卡片2 偏移量
		int two = one * 2;// 卡片2 --> 卡片3 偏移量
		
		@Override
		public void onPageScrollStateChanged(int arg0) {
			// arg0 ==1的时候表示正在滑动,arg0==2的时候表示滑动完毕了,arg0==0的时候表示什么都没做,就是停在那。
		}

		@Override
		public void onPageScrolled(int arg0, float arg1, int arg2) {
			// 表示在前一个页面滑动到后一个页面的时候,在前一个页面滑动前调用的方法
		}

		@Override
		public void onPageSelected(int position) {
			
			// 左右移动动画
			Animation animation = new TranslateAnimation(one * currentIndex,
					one * position, 0, 0);
			currentIndex = position;
			// 图片停留在动画结束的位置
			animation.setFillAfter(true);
			animation.setDuration(100);
			imageView.startAnimation(animation);
			Toast.makeText(TabActivity.this, "卡片移向了第" + position + "页",
					Toast.LENGTH_SHORT).show();
			
		}
	}
}

猜你喜欢

转载自forlan.iteye.com/blog/2259239
今日推荐