android 滑動翻頁手勢實現

  這個例子是用手勢實現翻頁效果，相當酷，個人覺得比gallery漂亮，可以用于廣告場合。思路：把Activity的TouchEvent交給GestureDetector處理。

這個程序使用了ViewFlipper組件，其實這個組件就是容器組件，可以調用addView（View v）添加多個組件，然后就可以用ViewFlipper使用動畫控制多個組件之間的切換效果

首先第一步是布局main.xml文件

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     >
     <ViewFlipper 
         android:id="@+id/flipper"
         android:layout_width="wrap_content"
         android:layout_height="120dp"/>
 </LinearLayout>

第二步：添加照片和在res文件夾下建立一個anim文件，里面放四個動畫xml文件，分別為left_in.xml,left_out.xml,right_in.xml.right_out.xml

<?xml version="1.0" encoding="utf-8"?>
 <!-- 左邊的進來left_in -->
 <set
     xmlns:android="http://schemas.android.com/apk/res/android">
     <translate
         android:fromXDelta="100%p"
         android:toXDelta="0"
         android:duration="500" />
     <alpha
         android:fromAlpha="0.0"
         android:toAlpha="1.0"
         android:duration="500" />
 </set>  


 <?xml version="1.0" encoding="utf-8"?>
 <!-- 左邊的出去left_out -->
 <set
     xmlns:android="http://schemas.android.com/apk/res/android">
     <translate
         android:fromXDelta="0"
         android:toXDelta="-100%p"
         android:duration="500" />
     <alpha
         android:fromAlpha="1.0"
         android:toAlpha="0.0"
         android:duration="500" />
 </set>  

 <?xml version="1.0" encoding="utf-8"?>
 <!-- 右邊的出去left_in -->
 <set
     xmlns:android="http://schemas.android.com/apk/res/android">
     <translate
         android:fromXDelta="-100%p"
         android:toXDelta="0"
         android:duration="500" />
     <alpha
         android:fromAlpha="0.0"
         android:toAlpha="1.0"
         android:duration="500" />
 </set>  

 <?xml version="1.0" encoding="utf-8"?>
 <!-- 右邊的出去left_out -->
 <set
     xmlns:android="http://schemas.android.com/apk/res/android">
     <translate
         android:fromXDelta="0"
         android:toXDelta="100%p"
         android:duration="500" />
     <alpha
         android:fromAlpha="1.0"
         android:toAlpha="0.0"
         android:duration="500" />
 </set>

第三步：編寫GestureActivity.java文件

package cn.shaoyangjiang.com;

 import android.app.Activity;
 import android.os.Bundle;
 import android.view.GestureDetector;
 import android.view.GestureDetector.OnGestureListener;
 import android.view.MotionEvent;
 import android.view.View;
 import android.view.animation.Animation;
 import android.view.animation.AnimationUtils;
 import android.widget.ImageView;
 import android.widget.ViewFlipper;

 public class GestureActivity extends Activity implements OnGestureListener{
     // ViewFlipper實例
     ViewFlipper flipper;
     // 定義手勢檢測器實例
     GestureDetector detector;
     //定義一個動畫數組，用于為ViewFlipper指定切換動畫效果
     Animation[] animations = new Animation[4];
     //定義手勢動作兩點之間的最小距離
     final int FLIP_DISTANCE = 50;
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.main);
         //創建手勢檢測器
         detector = new GestureDetector(this);
      // 獲得ViewFlipper實例
         flipper = (ViewFlipper)findViewById(R.id.flipper);
      // 為ViewFlipper添加5個ImageView組件
         flipper.addView(addImageView(R.drawable.katong));
         flipper.addView(addImageView(R.drawable.meinv));
         flipper.addView(addImageView(R.drawable.shan));
         flipper.addView(addImageView(R.drawable.tian));
         flipper.addView(addImageView(R.drawable.touming));
         //初始化Animation數組
         animations[0] = AnimationUtils.loadAnimation(this,R.anim.left_in);
         animations[1] = AnimationUtils.loadAnimation(this,R.anim.left_out);
         animations[2] = AnimationUtils.loadAnimation(this,R.anim.right_in);
         animations[3] = AnimationUtils.loadAnimation(this,R.anim.right_in);

     }
     // 定義添加ImageView的工具方法
     private View addImageView(int resId){
         ImageView imageView = new ImageView(this);
         imageView.setImageResource(resId);
         imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
         return imageView;
     }

     @Override
     public boolean onDown(MotionEvent arg0) {
         // TODO Auto-generated method stub
         return false;
     }
     @Override
     public boolean onFling(MotionEvent event1, MotionEvent event2, float velocityX,
             float velocityY) {
         /*
          * 如果第一個觸點事件的X座標大于第二個觸點事件的X座標超過FLIP_DISTANCE
          * 也就是手勢從右向左滑。
 */
         if (event1.getX() - event2.getX() > FLIP_DISTANCE)
         {
             // 為flipper設置切換的的動畫效果
             flipper.setInAnimation(animations[0]);
             flipper.setOutAnimation(animations[1]);
             flipper.showPrevious();
             return true;
         }
         /*
          * 如果第二個觸點事件的X座標大于第一個觸點事件的X座標超過FLIP_DISTANCE 
          * 也就是手勢從右向左滑。
 */
         else if (event2.getX() - event1.getX() > FLIP_DISTANCE)
         {
             // 為flipper設置切換的的動畫效果
             flipper.setInAnimation(animations[2]);
             flipper.setOutAnimation(animations[3]);
             flipper.showNext();
             return true;
         }
         return false;
     }
     @Override
     public void onLongPress(MotionEvent event) {

     }
     @Override
     public boolean onScroll(MotionEvent arg0, MotionEvent arg1, float arg2,
             float arg3) {
         return false;
     }
     @Override
     public void onShowPress(MotionEvent arg0) {

     }
     @Override
     public boolean onSingleTapUp(MotionEvent event) {
         return false;
     }

     @Override
     public boolean onTouchEvent(MotionEvent event) {
         //將該Activity上的觸碰事件交給GestureDetector處理
         return detector.onTouchEvent(event);
     }
 }