Tab页面手势滑动切换以及动画效果

。

  

3张页卡之间的切换。带动画效果。

工程结构。

主要应用到android-support-v4.jar这个jar包。
布局文件。
1、main.xml中的代码

[html]
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical" > 
 
    <LinearLayout 
        android:id="@+id/linearLayout1" 
        android:layout_width="fill_parent" 
        android:layout_height="100.0dip" 
        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="22.0dip" /> 
 
        <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="22.0dip" /> 
 
        <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="22.0dip" /> 
    </LinearLayout> 
 
    <ImageView 
        android:id="@+id/cursor" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:scaleType="matrix" 
        android:src="@drawable/a" /> 
 
    <android.support.v4.view.ViewPager 
        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" 
        android:persistentDrawingCache="animation" /> 
 
</LinearLayout> 
2、lay1.xml
[html] 
<?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:background="#158684" 
    android:orientation="vertical" > 
 
</LinearLayout> 
3、lay2.xml
[html]
<?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:background="#FF8684" 
    android:orientation="vertical" > 
 
</LinearLayout> 
4、lay3.xml
[html] 
<?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:background="#1586FF" 
    android:orientation="vertical" > 
 
</LinearLayout> 

主要代码。
[java] 
/**
 * Tab页面手势滑动切换以及动画效果
 * 
 */ 
public class MainActivity extends Activity { 
    // ViewPager是google SDk中自带的一个附加包的一个类，可以用来实现屏幕间的切换。 
    // android-support-v4.jar 
    private ViewPager mPager;// 页卡内容 
    private List<View> listViews; // Tab页面列表 
    private ImageView cursor;// 动画图片 
    private TextView t1, t2, t3;// 页卡头标 
    private int offset = 0;// 动画图片偏移量 
    private int currIndex = 0;// 当前页卡编号 
    private int bmpW;// 动画图片宽度 
 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.main); 
        InitImageView(); 
        InitTextView(); 
        InitViewPager(); 
    } 
 
    /**
     * 初始化头标
     */ 
    private void InitTextView() { 
        t1 = (TextView) findViewById(R.id.text1); 
        t2 = (TextView) findViewById(R.id.text2); 
        t3 = (TextView) findViewById(R.id.text3); 
 
        t1.setOnClickListener(new MyOnClickListener(0)); 
        t2.setOnClickListener(new MyOnClickListener(1)); 
        t3.setOnClickListener(new MyOnClickListener(2)); 
    } 
 
    /**
     * 初始化ViewPager
     */ 
    private void InitViewPager() { 
        mPager = (ViewPager) findViewById(R.id.vPager); 
        listViews = new ArrayList<View>(); 
        LayoutInflater mInflater = getLayoutInflater(); 
        listViews.add(mInflater.inflate(R.layout.lay1, null)); 
        listViews.add(mInflater.inflate(R.layout.lay2, null)); 
        listViews.add(mInflater.inflate(R.layout.lay3, null)); 
        mPager.setAdapter(new MyPagerAdapter(listViews)); 
        mPager.setCurrentItem(0); 
        mPager.setOnPageChangeListener(new MyOnPageChangeListener()); 
    } 
 
    /**
     * 初始化动画
     */ 
    private void InitImageView() { 
        cursor = (ImageView) findViewById(R.id.cursor); 
        bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.a) 
                .getWidth();// 获取图片宽度 
        DisplayMetrics dm = new DisplayMetrics(); 
        getWindowManager().getDefaultDisplay().getMetrics(dm); 
        int screenW = dm.widthPixels;// 获取分辨率宽度 
        offset = (screenW / 3 - bmpW) / 2;// 计算偏移量 
        Matrix matrix = new Matrix(); 
        matrix.postTranslate(offset, 0); 
        cursor.setImageMatrix(matrix);// 设置动画初始位置 
    } 
 
    /**
     * ViewPager适配器
     */ 
    public class MyPagerAdapter extends PagerAdapter { 
        public List<View> mListViews; 
 
        public MyPagerAdapter(List<View> mListViews) { 
            this.mListViews = mListViews; 
        } 
 
        @Override 
        public void destroyItem(View arg0, int arg1, Object arg2) { 
            ((ViewPager) arg0).removeView(mListViews.get(arg1)); 
        } 
 
        @Override 
        public void finishUpdate(View arg0) { 
        } 
 
        @Override 
        public int getCount() { 
            return mListViews.size(); 
        } 
 
        @Override 
        public Object instantiateItem(View arg0, int arg1) { 
            ((ViewPager) arg0).addView(mListViews.get(arg1), 0); 
            return mListViews.get(arg1); 
        } 
 
        @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) { 
        } 
    } 
 
    /**
     * 头标点击监听
     */ 
    public class MyOnClickListener implements View.OnClickListener { 
        private int index = 0; 
 
        public MyOnClickListener(int i) { 
            index = i; 
        } 
 
        @Override 
        public void onClick(View v) { 
            mPager.setCurrentItem(index); 
        } 
    }; 
 
    /**
     * 页卡切换监听
     */ 
    public class MyOnPageChangeListener implements OnPageChangeListener { 
 
        int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量 
        int two = one * 2;// 页卡1 -> 页卡3 偏移量 
 
        @Override 
        public void onPageSelected(int arg0) { 
            Animation animation = null; 
            switch (arg0) { 
            case 0: 
                if (currIndex == 1) { 
                    animation = new TranslateAnimation(one, 0, 0, 0); 
                } else if (currIndex == 2) { 
                    animation = new TranslateAnimation(two, 0, 0, 0); 
                } 
                break; 
            case 1: 
                if (currIndex == 0) { 
                    animation = new TranslateAnimation(offset, one, 0, 0); 
                } else if (currIndex == 2) { 
                    animation = new TranslateAnimation(two, one, 0, 0); 
                } 
                break; 
            case 2: 
                if (currIndex == 0) { 
                    animation = new TranslateAnimation(offset, two, 0, 0); 
                } else if (currIndex == 1) { 
                    animation = new TranslateAnimation(one, two, 0, 0); 
                } 
                break; 
            } 
            currIndex = arg0; 
            animation.setFillAfter(true);// True:图片停在动画结束位置 
            animation.setDuration(300); 
            cursor.startAnimation(animation); 
        } 
 
        @Override 
        public void onPageScrolled(int arg0, float arg1, int arg2) { 
        } 
 
        @Override 
        public void onPageScrollStateChanged(int arg0) { 
        } 
    } 
}