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) {?
??????? }?
??? }?
}?
總結
以上是生活随笔為你收集整理的Tab页面手势滑动切换以及动画效果的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Android使用ViewFlipper
- 下一篇: TextView显示插入的图片