android的左右滑动效果实现-ViewFlipper

说到android的左右滑动效果我们可以说是在每个应用上面都可以看到这样的效果，不管是微博，还是QQ等。实现左右滑动的方式很多，有ViewPaer(不过这个和需要android-support-v4.jar的支持)，自定义实现Viewgroup，gallery等都可以达到这种效果。这里做下ViewFliper实现左右滑动的效果。
以下会会用到的技术有： 1、ViewFlipper 2、GestureDetector 3、Animation 主要是这三个类再起作用。
原理：向左向右滑动主要是依赖手势来控制，手势向右滑动就调用 viewFlipper.showNext();方法，同理，向左滑动就会去调用viewFlipper.showPrevious();方法。
接下来直接上代码：
首先在布局文件中添加ViewFlipper的标签：

复制内容到剪贴板

代码:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent" >
   <ViewFlipper        android:id="@+id/viewFlipper"        android:layout_width="match_parent"        android:layout_height="match_parent"        ></ViewFlipper>
< /RelativeLayout>

编写代码：

复制内容到剪贴板

代码:

package com.xzw.ui;
import android.app.Activity; import android.os.Bundle; import android.util.Log; import android.view.GestureDetector; import android.view.GestureDetector.OnGestureListener; import android.view.MotionEvent; import android.view.View; import android.view.ViewGroup; import android.view.Window; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.ImageView; import android.widget.ViewFlipper; /** * 左右滑动demo * @author xzw * */ public class MainActivity extends Activity implements OnGestureListener {                  private static final String TAG = "MainActivity";                  private ViewFlipper viewFlipper;         private GestureDetector detector; //手势检测
        Animation leftInAnimation;         Animation leftOutAnimation;         Animation rightInAnimation;         Animation rightOutAnimation;     @Override     public void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         requestWindowFeature(Window.FEATURE_NO_TITLE);         setContentView(R.layout.activity_main);                  viewFlipper = (ViewFlipper)findViewById(R.id.viewFlipper);         detector = new GestureDetector(this);                  //往viewFlipper添加View         viewFlipper.addView(getImageView(R.drawable.new_feature_1));         viewFlipper.addView(getImageView(R.drawable.new_feature_2));         viewFlipper.addView(getImageView(R.drawable.new_feature_3));         viewFlipper.addView(getImageView(R.drawable.new_feature_4));         viewFlipper.addView(getImageView(R.drawable.new_feature_5));         viewFlipper.addView(getImageView(R.drawable.new_feature_6));                  //动画效果             leftInAnimation = AnimationUtils.loadAnimation(this, R.anim.left_in);                 leftOutAnimation = AnimationUtils.loadAnimation(this, R.anim.left_out);                 rightInAnimation = AnimationUtils.loadAnimation(this, R.anim.right_in);                 rightOutAnimation = AnimationUtils.loadAnimation(this, R.anim.right_out);     }
    private ImageView getImageView(int id){             ImageView imageView = new ImageView(this);             imageView.setImageResource(id);             return imageView;     }
    @Override     public boolean onTouchEvent(MotionEvent event) {                   return this.detector.onTouchEvent(event); //touch事件交给手势处理。     }             @Override         public boolean onDown(MotionEvent e) {                 // TODO Auto-generated method stub                 return false;         }
        @Override         public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,                         float velocityY) {                 Log.i(TAG, "e1="+e1.getX()+" e2="+e2.getX()+" e1-e2="+(e1.getX()-e2.getX()));                                                          if(e1.getX()-e2.getX()>120){                         viewFlipper.setInAnimation(leftInAnimation);                         viewFlipper.setOutAnimation(leftOutAnimation);                     viewFlipper.showNext();//向右滑动                     return true;                 }else if(e1.getX()-e2.getY()<-120){                         viewFlipper.setInAnimation(rightInAnimation);                         viewFlipper.setOutAnimation(rightOutAnimation);                         viewFlipper.showPrevious();//向左滑动                         return true;                 }                 return false;         }
        @Override         public void onLongPress(MotionEvent e) {                 // TODO Auto-generated method stub                         }
        @Override         public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,                         float distanceY) {                 // TODO Auto-generated method stub                 return false;         }
        @Override         public void onShowPress(MotionEvent e) {                 // TODO Auto-generated method stub                         }
        @Override         public boolean onSingleTapUp(MotionEvent e) {                 // TODO Auto-generated method stub                 return false;         }         }

接下来我们编写动画效果的xml文件，你也可以通过代码实现，这里使用xml配置，个人感觉比较简单。
left_in.xml

复制内容到剪贴板

代码:

<?xml version="1.0" encoding="utf-8"?> < set xmlns:android="http://schemas.android.com/apk/res/android">     <translate         android:fromXDelta="100%p"         android:toXDelta="0"         android:duration="600"         />     <alpha         android:fromAlpha="0.1"         android:toAlpha="1.0"         android:duration="600"         />
< /set>

left_out.xml

复制内容到剪贴板

代码:

<?xml version="1.0" encoding="utf-8"?> < set xmlns:android="http://schemas.android.com/apk/res/android">     <translate         android:fromXDelta="0"         android:toXDelta="-100%p"         android:duration="600"         />     <alpha         android:fromAlpha="1.0"         android:toAlpha="0.1"         android:duration="600"         />
< /set>

right_in.xml

复制内容到剪贴板

代码:

<?xml version="1.0" encoding="utf-8"?> < set xmlns:android="http://schemas.android.com/apk/res/android">     <translate         android:fromXDelta="-100%p"         android:toXDelta="0"         android:duration="600"         />     <alpha         android:fromAlpha="0.1"         android:toAlpha="1.0"         android:duration="600"         />
< /set>

right_out.xml

复制内容到剪贴板

代码:

<?xml version="1.0" encoding="utf-8"?> < set xmlns:android="http://schemas.android.com/apk/res/android">     <translate         android:fromXDelta="0"         android:toXDelta="100%p"         android:duration="600"         />     <alpha         android:fromAlpha="1.0"         android:toAlpha="0.1"         android:duration="600"         />
< /set>

以上就是完整的代码，看起来很简单吧。 看下面的效果图吧，秋天到了，图片也选择的有秋意点儿哈。 附上源代码：http://down.51cto.com/data/579206