Android之手势交互的详解

手势:是指用户手指或者触摸笔在触摸屏上连续触碰的一种行为
使用手势检测需要俩个步骤:
1.创建一个GestureDetector对象，识别各种手势

2.为应用程序的activity的TouchEvent事件绑定事件监听器,在事件处理中指定把activity上的touchEvent的事件交给GestureDetector处理

代码如下：

	//1.创建一个GestureDetector对象,识别各种手势
	private GestureDetector mGestureDetector;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mGestureDetector=new GestureDetector(this, this);
	}
	
	//2.在事件处理中指定把activity上的touchEvent的事件交给GestureDetector处理
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		return mGestureDetector.onTouchEvent(event);
	}
	

识别手势有6个方法~

分别为onDown，onShowPress，onSingleTapUp，onScroll，onLongPress，onFling

让Activity实现OnGestureListener接口，这就要重写这6个方法~

详细解释如下：

       //按下:刚刚手指接触到触摸屏的那一刹那
	@Override
	public boolean onDown(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onDown");
		return false;
	}
	//按住:手指按在触摸屏上,它的时间范围在按下起效,在长按之前
	@Override
	public void onShowPress(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onShowPress");
		
	}
	//抬起:手指离开触摸屏的那一刹那,
	@Override
	public boolean onSingleTapUp(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onSingleTapUp");
		return false;
	}
	//滑动
	@Override
	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
		// TODO Auto-generated method stub
		System.out.println("onScroll");
		return false;
	}
	//长按,手指按住持续一段时间,并且没有松开
	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onLongPress");
		
	}
	//抛掷:快速滑动的时候执行这个方法,并且松开的动作
	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
		// TODO Auto-generated method stub
		System.out.println("onFling");
		return false;
	}

状态不同的时候要调用哪个方法呢？？？如下：

点击:onDown-onSingleTapup
长按并且未抬起:onDown--onShowPress--onLongPress
长按(按了一段时间就抬起了):onDown--onShowPress--onSingleTapup
迅速滑动:onDown--onScroll....--onFling
缓慢滑动:onDown--onScroll.....

MainActivity全部代码：

public class MainActivity extends Activity implements OnGestureListener{

	//1.创建一个GestureDetector对象,识别各种手势
	private GestureDetector mGestureDetector;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mGestureDetector=new GestureDetector(this, this);
	}
	
	//2.在事件处理中指定把activity上的touchEvent的事件交给GestureDetector处理
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		return mGestureDetector.onTouchEvent(event);
	}
	
	
	//按下:刚刚手指接触到触摸屏的那一刹那
	@Override
	public boolean onDown(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onDown");
		return false;
	}
	//按住:手指按在触摸屏上,它的时间范围在按下起效,在长按之前
	@Override
	public void onShowPress(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onShowPress");
		
	}
	//抬起:手指离开触摸屏的那一刹那,
	@Override
	public boolean onSingleTapUp(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onSingleTapUp");
		return false;
	}
	//滑动
	@Override
	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
		// TODO Auto-generated method stub
		System.out.println("onScroll");
		return false;
	}
	//长按,手指按住持续一段时间,并且没有松开
	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onLongPress");
	}
	//抛掷:快速滑动的时候执行这个方法,并且松开的动作
	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
		// TODO Auto-generated method stub
		System.out.println("onFling");
		return false;
	}
}

效果图：

现在再实现另外一个功能~

长按跳转到电子翻书效果的一个界面~

只需要在onLongPress方法中添加几行代码就行了~

	//长按,手指按住持续一段时间,并且没有松开
	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
		System.out.println("onLongPress");
		Intent intent=new Intent(this,SecondActivity.class);
		startActivity(intent);
	}

在SecondActivity的这个界面中，实现了电子翻书的效果-动画左右滑动效果

其实也就是使用了补件动画的知识~

还使用ViewFlipper实现了动画的左右滑动效果

步骤如下：

在res文件下新建anim文件

在anim文件夹下面新建了4个xml文件，分别是next_in,next_off,pre_in,pre_off,分别代表的意思是下一张图片向左进来，这一张图片向左出去，上一张图片向右进来，这一张图片向右出去

代码如下：

next_in:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="100%p"
    android:fromYDelta="0"
    android:toXDelta="0"
    android:toYDelta="0">
    
</translate>

next_off:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toXDelta="-100%p"
    android:toYDelta="0">
    

</translate>

pre_in:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="-100%p"
    android:fromYDelta="0"
    android:toXDelta="0"
    android:toYDelta="0">
    

</translate>

pre_off:

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toXDelta="100%p"
    android:toYDelta="0">
</translate>

MainActivity：

public class SecondActivity extends Activity implements OnGestureListener{

	//电子翻书动作
	
	private ViewFlipper mViewFlipper;
	private GestureDetector mGestureDetector;
	private Animation[] animations=new Animation[4];
	
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_second);
		animations[0]=AnimationUtils.loadAnimation(this, R.anim.next_in);
		animations[1]=AnimationUtils.loadAnimation(this, R.anim.next_off);
		animations[2]=AnimationUtils.loadAnimation(this, R.anim.pre_in);
		animations[3]=AnimationUtils.loadAnimation(this, R.anim.pre_off);
		mGestureDetector=new GestureDetector(this, this);
		mViewFlipper=(ViewFlipper) findViewById(R.id.vf);
		mViewFlipper.addView(getImageView(R.drawable.a1));
		mViewFlipper.addView(getImageView(R.drawable.a2));
		mViewFlipper.addView(getImageView(R.drawable.a3));
	}

	private ImageView getImageView(int resId){
		ImageView imageView=new ImageView(this);
		imageView.setImageResource(resId);
		return imageView;
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		return mGestureDetector.onTouchEvent(event);
	}
	@Override
	public boolean onDown(MotionEvent e) {
		// 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;
	}

	@Override
	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
		// TODO Auto-generated method stub
		return false;
	}

	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
	}

	
	/*
	 *第一个参数:按下的触点
	 *第二个参数:抬起的触点
	 *第三个参数:在x轴的滑动速度
	 *第四个:在y轴的滑动速度
	 */
	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
		// TODO Auto-generated method stub
		//50是误差值
		if(e2.getX()-e1.getX()>50){
			//从左向右滑
			//这一页向右出去
			mViewFlipper.setOutAnimation(animations[3]);
			//上一页进来
			mViewFlipper.setInAnimation(animations[2]);
			mViewFlipper.showPrevious();
		}else if(e1.getX()-e2.getX()>50){
			//从右向左滑
			//这一页向左出去
			mViewFlipper.setOutAnimation(animations[1]);
			//下一页向左进来
			mViewFlipper.setInAnimation(animations[0]);
			mViewFlipper.showNext();
		}
		return false;
	}
}

效果图如下：

现在在实现另外一个功能~俩点的触摸使图片变大变小

这个是要到真机上测试的~

一样在SecondActivity中的onLongPress方法中添加跳转到ThirdActivity的代码，这里我就不写了~

在ThirdActivity中，通过手指的距离来控制图片的大小

我就不详细说了，代码如下：

public class ThirdACtivity extends Activity implements OnGestureListener{

	private ImageView image;
	private GestureDetector mGestureDetector;
	private float lastCurrent=-1f;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_third_activity);
		image=(ImageView) findViewById(R.id.image);
		mGestureDetector=new GestureDetector(this, this);
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
		return mGestureDetector.onTouchEvent(event);
	}
	
	@Override
	public boolean onDown(MotionEvent e) {
		// TODO Auto-generated method stub
		lastCurrent=-1f;
		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;
	}

	@Override
	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
		// TODO Auto-generated method stub
		if (e2.getPointerCount()==2) {
			float x=e2.getX(0)-e2.getX(1);
			float y=e2.getY(0)-e2.getY(1);
			float current=(float) Math.sqrt(x*x+y*y);
			if(lastCurrent<0){
				lastCurrent=current;
			}else{
				RelativeLayout.LayoutParams params=(RelativeLayout.LayoutParams) image.getLayoutParams();
			if (lastCurrent-current>2) {
				//俩点距离变小
				System.out.println("缩小");
				lastCurrent=current;
				//缩小
				params.width=(int) (0.9*image.getWidth());
				params.height=(int) (0.9*image.getHeight());
				//缩小最小到100
				if(params.width>100){
					image.setLayoutParams(params);
				}
			} else if(current-lastCurrent>2){
				//俩点距离变大
               System.out.println("放大");
               lastCurrent=current;
             //放大
				params.width=(int) (1.1*image.getWidth());
				params.height=(int) (1.1*image.getHeight());
				//放大最大到1000
				if(params.width<1000){
					image.setLayoutParams(params);
				}
			}
			}
		} 
		return true;
	}

	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
		
	}

	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
		// TODO Auto-generated method stub
		return false;
	}

	
}

效果图不好贴~我就不贴了

源码：http://download.csdn.net/detail/qq_33642117/9585069