android 滑动翻页手势实现
jopen
13年前
这个例子是用手势实现翻页效果,相当酷,个人觉得比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); } }