引子
如題需五，本節(jié)給大家?guī)淼氖荰ouchListener與OnTouchEvent的比較缸血，以及多點觸碰的知識點飒炎！
- TouchListener 是 基于監(jiān)聽 的，
- OnTouchEvent則是 基于回調 的！
下面通過兩個簡單的例子來加深理解耕驰！
1. 基于監(jiān)聽的TouchListener
代碼示例：
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<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"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:gravity="center"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imgTouch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/bizhi"
/>
</RelativeLayout>
MainActivity.java
package io.pifoo.touch;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView imgTouch = (ImageView)findViewById(R.id.imgTouch);
imgTouch.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
Log.i("TouchXY",event.getX() + "," + event.getY() );
Toast.makeText(getApplicationContext(),"你通過監(jiān)聽器模式:OnTouchListener摸了倫家~",Toast.LENGTH_SHORT).show();
return true;
}
});
}
}
代碼解析：
就是簡單的設置一個ImageView,然后setOnTouchListener,重寫onTouch方法即可!
OnTouchListener相關方法與屬性:
onTouch(View v, MotionEvent event):
這里面的參數(shù)依次是觸發(fā)觸摸事件的組件,觸碰事件event 封裝了觸發(fā)事件的詳細信息咏花，同樣包括事件的類型苍匆、觸發(fā)時間等信息叔汁。比如event.getX(),event.getY() , 我們也可以對觸摸的動作類型進行判斷,使用event.getAction( )再進行判斷;如:
- event.getAction == MotionEvent.ACTION_DOWN,按下事件
- event.getAction == MotionEvent.ACTION_MOVE:移動事件
- event.getAction == MotionEvent.ACTION_UP:彈起事件
2. 基于回調的onTouchEvent( )方法
同樣是觸碰事件,但是onTouchEvent更多的是用于自定義的view,所有的view類中都重寫了該方法,而這種觸摸事件是基于回調的,也就是說:如果我們返回的值是false的話,那么事件會繼續(xù)向外傳播,由外面的容器或者Activity進行處理!當然還涉及到了手勢(Gesture),這個我們會在后面進行詳細的講解!
onTouchEvent其實和onTouchListener是類似的,只是處理機制不用,前者是回調,后者是監(jiān)聽模式瑰钮！
代碼示例：
定義一個簡單的view，繪制一個小圓，可以跟隨手指進行移動
實現(xiàn)代碼：
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<io.pifoo.touch.MyView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
MainActivity.java
package io.pifoo.touch;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
MyView.java
package io.pifoo.touch;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
/**
* Created by pifoo on 15/10/17.
*/
public class MyView extends View {
public float X = 50;
public float Y = 50;
//創(chuàng)建畫筆
Paint paint = new Paint();
public MyView(Context context,AttributeSet set) {
super(context,set);
}
@Override
public void onDraw(Canvas canvas){
super.onDraw(canvas);
paint.setColor(Color.GREEN);
canvas.drawCircle(X, Y, 30, paint);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
this.X = event.getX();
this.Y = event.getY();
//通知組件進行重繪
this.invalidate();
return true;
}
}
3.多點觸碰
原理：
所謂的多點觸碰就是多個手指在屏幕上進行操作，用的最多的估計是放大縮功能吧杈湾，比如很多的圖片瀏覽器都支持縮放！理論上Android系統(tǒng)本身可以處理多達256個手指的觸摸，當然這取決于手機硬件的支持至会；不過支持多點觸摸的手機一般支持2-4個點宵蛀，當然有些更多窃这！我們發(fā)現(xiàn)前面兩點都有用到MotionEvent，MotionEvent代表的是一個觸摸事件兆解；前我們可以根據(jù)event.getAction() & MotionEvent.ACTION_MASK來判斷是哪種操作，除了上面介紹的三種單點操作外，還有兩個多點專用的操作：
- MotionEvent.ACTION_POINTER_DOWN:當屏幕上已經(jīng)有一個點被按住印蔬，此時再按下其他點時觸發(fā)。
- MotionEvent.ACTION_POINTER_UP:當屏幕上有多個點被按住，松開其中一個點時觸發(fā)（即非最后一個點被放開時）铜邮。
簡單的流程大概是這樣：
- 當我們一個手指觸摸屏幕 ——> 觸發(fā)ACTION_DOWN事件
- 接著有另一個手指也觸摸屏幕 ——> 觸發(fā)ACTION_POINTER_DOWN事件,如果還有其他手指觸摸已旧，繼續(xù)觸發(fā)
- 有一個手指離開屏幕 ——> 觸發(fā)ACTION_POINTER_UP事件惊楼，繼續(xù)有手指離開雅倒，繼續(xù)觸發(fā)
- 當最后一個手指離開屏幕 ——> 觸發(fā)ACTION_UP事件
- 而且在整個過程中棕诵，ACTION_MOVE事件會一直不停地被觸發(fā)
我們可以通過event.getX(int)或者event.getY(int)來獲得不同觸摸點的位置：
- 比如event.getX(0)可以獲得第一個接觸點的X坐標价脾，event.getX(1)獲得第二個接觸點的X坐標這樣…
- 另外妹孙，我們還可以在調用MotionEvent對象的getPointerCount()方法判斷當前有多少個手指在觸摸~
代碼示例：
好吧华匾，我們來寫個最常見的單指拖動圖片，雙指縮放圖片的示例吧：
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imgTouch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="matrix"
android:src="@drawable/bizhi"
/>
</LinearLayout>
Main.java
package io.pifoo.touch;
import android.app.Activity;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
/**
* Created by pifoo on 15/10/17.
*/
public class Main extends Activity implements OnTouchListener {
private ImageView imgTouch;
// 縮放控制
private Matrix matrix = new Matrix();
private Matrix savedMatrix = new Matrix();
// 不同狀態(tài)的表示：
private static final int NONE = 0;
private static final int DRAG = 1;
private static final int ZOOM = 2;
private int mode = NONE;
// 定義第一個按下的點，兩只接觸點的重點稍味，以及出事的兩指按下的距離：
private PointF startPoint = new PointF();
private PointF midPoint = new PointF();
private float oriDis = 1f;
/*
* (non-Javadoc)
*
* @see android.app.Activity#onCreate(android.os.Bundle)
*/
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imgTouch = (ImageView) this.findViewById(R.id.imgTouch);
imgTouch.setOnTouchListener(this);
}
@Override
public boolean onTouch(View v, MotionEvent event) {
ImageView view = (ImageView) v;
switch (event.getAction() & MotionEvent.ACTION_MASK) {
// 單指
case MotionEvent.ACTION_DOWN:
matrix.set(view.getImageMatrix());
savedMatrix.set(matrix);
startPoint.set(event.getX(), event.getY());
mode = DRAG;
break;
// 雙指
case MotionEvent.ACTION_POINTER_DOWN:
oriDis = distance(event);
if (oriDis > 10f) {
savedMatrix.set(matrix);
midPoint = middle(event);
mode = ZOOM;
}
break;
// 手指放開
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
break;
// 單指滑動事件
case MotionEvent.ACTION_MOVE:
if (mode == DRAG) {
// 是一個手指拖動
matrix.set(savedMatrix);
matrix.postTranslate(event.getX() - startPoint.x, event.getY() - startPoint.y);
} else if (mode == ZOOM) {
// 兩個手指滑動
float newDist = distance(event);
if (newDist > 10f) {
matrix.set(savedMatrix);
float scale = newDist / oriDis;
matrix.postScale(scale, scale, midPoint.x, midPoint.y);
}
}
break;
}
// 設置ImageView的Matrix
view.setImageMatrix(matrix);
return true;
}
// 計算兩個觸摸點之間的距離
private float distance(MotionEvent event) {
float x = event.getX(0) - event.getX(1);
float y = event.getY(0) - event.getY(1);
//Android5.0使用 FloatMath已過時，直接使用Math
return (float)Math.sqrt(x * x + y * y);
}
// 計算兩個觸摸點的中點
private PointF middle(MotionEvent event) {
float x = event.getX(0) + event.getX(1);
float y = event.getY(0) + event.getY(1);
return new PointF(x / 2, y / 2);
}
}
