Android知识总结
一、GestureDetector单指点击手势
GestureDetector的工作原理是，当我们接收到用户触摸消息时，将这个消息交给GestureDetector去加工，我们通过设置侦听器获得GestureDetector处理后的手势。
GestureDetector提供了两个侦听器接口，OnGestureListener处理单击类消息，OnDoubleTapListener处理双击类消息。
-
OnGestureListener的接口有这几个：
// 单击，触摸屏按下时立刻触发
abstract boolean onDown(MotionEvent e);
// 单击抬起，手指离开触摸屏时触发(长按、滚动、滑动时，不会触发这个手势)
//单击抬起时触发，且只在双击的第一次抬起时触发。（连续点击三次，则会触发两次）
abstract boolean onSingleTapUp(MotionEvent e);
// 短按(触摸反馈)，触摸屏按下后片刻后抬起，会触发这个手势，如果迅速抬起则不会
//它是在 View 被点击（按下）时调用，其作用是给用户一个视觉反馈，让用户知道我这个控件被点击了，
//这样的效果我们也可以用 Material design 的 ripple 实现，或者直接 drawable 写个背景也行。
//它是一种延时回调，延迟时间是 100 ms。也就是说用户手指按下后，如果立即抬起或者事件立即被拦截，
//时间没有超过 100 ms的话，这条消息会被 remove 掉，也就不会触发这个回调。
abstract void onShowPress(MotionEvent e);
// 长按，触摸屏按下后既不抬起也不移动，过一段时间后触发
abstract void onLongPress(MotionEvent e);
// 滚动，触摸屏按下后移动
// e1：手指按下时的 MotionEvent
// e2：手指当前的 MotionEvent
// distanceX：在X轴上划过的距离 --- 旧位置 减去 新位置
// distanceY：在Y轴上划过的距离
abstract boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY);
//处理惯性滑动。最小滑动速度50dip/s（dp=dip）。最大8000dp/s。
// 抛掷（惯性滑动）
// e1：手指按下时的 MotionEvent，可以知道按下位置等
// e2：手指当前的 MotionEvent
// velocityX：在X轴上的运动速度（像素/秒）
// velocityY：在Y轴上的运动速度（像素/秒）
abstract boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY);
-
OnDoubleTapListener的接口有这几个：
300ms内点击两次才算双击。
// 双击，手指在触摸屏上迅速点击第二下时触发
abstract boolean onDoubleTap(MotionEvent e);
// 在双击手势中发生事件时通知，包括按下、移动和抬起事件
//双击第二次点击时的按下，移动和抬起事件都会回调。
abstract boolean onDoubleTapEvent(MotionEvent e);
// 单击确认，即很快的按下并抬起，但并不连续点击第二下
abstract boolean onSingleTapConfirmed(MotionEvent e);
有时候我们并不需要处理上面所有手势，方便起见，Android提供了另外一个类SimpleOnGestureListener，实现了OnGestureListener, OnDoubleTapListener, OnContextClickListener这三个接口，并重写了接口的方法。所以我们可以 new 一个 SimpleOnGestureListener 对象，这样就不用重写接口的所有方法，而只写自己需要的方法即可
1.1、双击缩放
// 创建 GestureDetector对象
gestureDetector = new GestureDetector(context, new PhotoGestureListener());
class PhotoGestureListener extends GestureDetector.SimpleOnGestureListener {
// 必须为true才表示消费事件
@Override
public boolean onDown(MotionEvent e) {
return true;
}
// 双击处理缩放
@Override
public boolean onDoubleTap(MotionEvent e) {
isEnlarge = !isEnlarge;
if (isEnlarge) {
currentScale = bigScale;
} else {
currentScale = smallScale;
}
invalidate();
return super.onDoubleTap(e);
}
}
//必须重写onTouchEvent，因为GestureDetector里面自己重写了事件处理。
@Override
public boolean onTouchEvent(MotionEvent event) {
return gestureDetector.onTouchEvent(event);
}
1.2、缩放效果
public boolean onDoubleTap(MotionEvent e) {
isEnlarge = !isEnlarge;
if (isEnlarge) {
getScaleAnimator().start();
} else {
getScaleAnimator().reverse();
}
return super.onDoubleTap(e);
}
private ObjectAnimator getScaleAnimator() {
if (scaleAnimator == null) {
// values必须要有，否则运行时报错
scaleAnimator = ObjectAnimator.ofFloat(this,
"currentScale", 0);
}
scaleAnimator.setFloatValues(smallScale, bigScale);
return scaleAnimator;
}
public float getCurrentScale() {
return currentScale;
}
public void setCurrentScale(float currentScale) {
this.currentScale = currentScale;
// 属性动画变化是刷新界面
invalidate();
}
1.3、手指滑动
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
if (isEnlarge) {
offsetX -= distanceX;
offsetY -= distanceY;
// 处理边界问题
fixOffsets();
invalidate();
}
return super.onScroll(e1, e2, distanceX, distanceY);
}
private void fixOffsets() {
offsetX = Math.min(offsetX, (bitmap.getWidth() * bigScale - getWidth()) / 2);
offsetX = Math.max(offsetX, -(bitmap.getWidth() * bigScale - getWidth()) / 2);
offsetY = Math.min(offsetY, (bitmap.getHeight() * bigScale - getHeight()) / 2);
offsetY = Math.max(offsetY, -(bitmap.getHeight() * bigScale - getHeight()) / 2);
}
1.4、惯性滑动
public boolean onFling(MotionEvent down, MotionEvent event, float velocityX, float velocityY) {
if (isEnlarge) {
overScroller.fling((int) offsetX, (int) offsetY, (int) velocityX, (int) velocityY,
-(int) (bitmap.getWidth() * bigScale - getWidth()) / 2,
(int) (bitmap.getWidth() * bigScale - getWidth()) / 2,
-(int) (bitmap.getHeight() * bigScale - getHeight()) / 2,
(int) (bitmap.getHeight() * bigScale - getHeight()) / 2);
postOnAnimation(flingRunner);
}
return false;
}
class FlingRunner implements Runnable {
@Override
public void run() {
// 动画还在执行，返回true
if (overScroller.computeScrollOffset()) {
offsetX = overScroller.getCurrX();
offsetY = overScroller.getCurrY();
invalidate();
postOnAnimation(this);
}
}
}
二、ScaleGestureDetector 双指点击手势
//缩放时。返回值代表本次缩放事件是否已被处理。如果已被处理，那么detector就会重置缩
//放事件；如果未被处理，detector会继续进行计算，修改getScaleFactor()的返回值，直到被
//处理为止。因此，它常用在判断只有缩放值达到一定数值时才进行缩放。
public boolean onScale(ScaleGestureDetector detector)；
// 缩放开始。该detector是否处理后继的缩放事件。返回false时，不会执行onScale()。
public boolean onScaleBegin(ScaleGestureDetector detector);
//缩放结束时
public void onScaleEnd(ScaleGestureDetector detector);
2.1、实现
scaleGestureListener = new PhotoScaleGestureListener();
scaleGestureDetector = new ScaleGestureDetector(context, scaleGestureListener);
public boolean onTouchEvent(MotionEvent event) {
// 双指缩放操作优先处理事件
boolean result = scaleGestureDetector.onTouchEvent(event);
// 如果不是双指缩放才处理手势事件
if (!scaleGestureDetector.isInProgress()) {
result = gestureDetector.onTouchEvent(event);
}
return result;
}
class PhotoScaleGestureListener implements ScaleGestureDetector.OnScaleGestureListener {
float initialScale;
// 缩放中回调 -- 倍数，焦点
@Override
public boolean onScale(ScaleGestureDetector detector) {
// getScaleFactor：将比例因子从上一个缩放事件返回到当前事件
currentScale = initialScale * detector.getScaleFactor();
invalidate();
return false;
}
// 缩放前回调,返回true 消费这个缩放事件
@Override
public boolean onScaleBegin(ScaleGestureDetector detector) {
initialScale = currentScale;
return true;
}
// 缩放后回调
@Override
public void onScaleEnd(ScaleGestureDetector detector) {
}
}
三、实例代码
实现 图片的放大、缩小、平移、惯性处理和单双指操作。
public class PhotoView extends View {
private Bitmap mBitmap;
private Paint mPaint;
// 偏移值
private float mOriginalOffsetX;
private float mOriginalOffsetY;
// 一边全屏，一边留白
private float mSmallScale;
// 一边全屏，一边超出屏幕
private float mBigScale;
private float OVER_SCALE_FACTOR = 1.5f;
private float mCurrentScale;
private FlingRunner flingRunner;
//用来实现抛出后的回弹效果
private OverScroller overScroller;
//是否放大
private boolean isEnlarge;
//偏移量
private float offsetX;
private float offsetY;
//判断是否进行了双指缩放
private boolean isScale;
private GestureDetector mGestureDetector;
private ScaleGestureDetector mScaleGestureDetector;
public PhotoView(Context context) {
this(context, null);
}
public PhotoView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs, 0);
}
public PhotoView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context);
}
private void init(Context context) {
// 获取bitmap对象
mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.photo);
mPaint = new Paint();
mGestureDetector = new GestureDetector(context, new PhotoGestureListener());
overScroller = new OverScroller(context);
flingRunner = new FlingRunner();
mScaleGestureDetector = new ScaleGestureDetector(context, new PhotoScaleGestureListener());
}
@Override
public boolean onTouchEvent(MotionEvent event) {
// 双指操作优先
boolean result = mScaleGestureDetector.onTouchEvent(event);
if (!mScaleGestureDetector.isInProgress()) {
result = mGestureDetector.onTouchEvent(event);
}
return result;
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// 需要得到 浮点数，否则会留条小缝
mOriginalOffsetX = (getWidth() - mBitmap.getWidth()) / 2f;
mOriginalOffsetY = (getHeight() - mBitmap.getHeight()) / 2f;
if ((float) mBitmap.getWidth() / mBitmap.getHeight() > (float) getWidth() / getHeight()) {
// 图片是横向的
mSmallScale = (float) getWidth() / mBitmap.getWidth();
mBigScale = (float) getHeight() / mBitmap.getHeight();
} else {
// 纵向的图片
mSmallScale = (float) getHeight() / mBitmap.getHeight();
mBigScale = (float) getWidth() / mBitmap.getWidth();
}
mCurrentScale = mSmallScale;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//TODO 通过系数解决，放大小小后图片位置仍然居中
float scaleFraction = (mCurrentScale - mSmallScale) / (mBigScale - mSmallScale);
//平移处理
canvas.translate(offsetX * scaleFraction, offsetY * scaleFraction);
// smallScale --》 bigScale （实际上是缩放坐标系）
canvas.scale(mCurrentScale, mCurrentScale, getWidth() / 2f, getHeight() / 2f);
// 绘制bitmap
canvas.drawBitmap(mBitmap, mOriginalOffsetX, mOriginalOffsetY, mPaint);
}
class PhotoGestureListener extends GestureDetector.SimpleOnGestureListener {
public PhotoGestureListener() {
super();
}
// Up时触发 双击的时候，触发两次？？第二次抬起时触发
@Override
public boolean onSingleTapUp(MotionEvent e) {
return super.onSingleTapUp(e);
}
// 长按 -- 300ms
@Override
public void onLongPress(MotionEvent e) {
super.onLongPress(e);
}
/**
* 类似move事件
*
* @param e1
* @param e2
* @param distanceX 在 X 轴上滑过的距离（单位时间） 旧位置 - 新位置
* @param distanceY
* @return
*/
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
// 只有在放大的情况下，才能进行移动
if (isEnlarge) {
offsetX -= distanceX;
offsetY -= distanceY;
fixOffsets();
invalidate();
}
return super.onScroll(e1, e2, distanceX, distanceY);
}
// 抛掷
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
if (isEnlarge) {
// 只会处理一次，抛出后的回弹效果实现
overScroller.fling((int) offsetX, (int) offsetY, (int) velocityX, (int) velocityY,
-(int) (mBitmap.getWidth() * mBigScale - getWidth()) / 2,
(int) (mBitmap.getWidth() * mBigScale - getWidth()) / 2,
-(int) (mBitmap.getHeight() * mBigScale - getHeight()) / 2,
(int) (mBitmap.getHeight() * mBigScale - getHeight()) / 2, 600, 600);
postOnAnimation(flingRunner); //启动动画事务
}
return super.onFling(e1, e2, velocityX, velocityY);
}
// 延时触发 100ms -- 点击效果，水波纹
@Override
public void onShowPress(MotionEvent e) {
super.onShowPress(e);
}
// 按下 -- 注意：直接返回true
@Override
public boolean onDown(MotionEvent e) {
return true;
}
// 双击 -- 第二次点击按下的时候 -- 40ms（小于表示：防抖动） -- 300ms
@Override
public boolean onDoubleTap(MotionEvent e) {
isEnlarge = !isEnlarge;
if (isEnlarge) {
//TODO 解决，以手指点击的位置放大缩小问题
offsetX = (e.getX() - getWidth() / 2f) - (e.getX() - getWidth() / 2f) * mBigScale / mSmallScale;
offsetY = (e.getY() - getHeight() / 2f) - (e.getY() - getHeight() / 2f) * mBigScale / mSmallScale;
fixOffsets();
// 启动属性动画
getScaleAnimator().start();
} else {
getScaleAnimator().reverse();
}
return super.onDoubleTap(e);
}
// 双击第二次 down、move、up都会触发
@Override
public boolean onDoubleTapEvent(MotionEvent e) {
return super.onDoubleTapEvent(e);
}
// 单击按下时触发，双击时不触发，
// 延时300ms触发TAP事件
@Override
public boolean onSingleTapConfirmed(MotionEvent e) {
return super.onSingleTapConfirmed(e);
}
@Override
public boolean onContextClick(MotionEvent e) {
return super.onContextClick(e);
}
}
//实现一直循环执行动画
class FlingRunner implements Runnable {
@Override
public void run() {
// 动画还在执行 则返回true
if (overScroller.computeScrollOffset()) {
//拿到当前偏移量，进行刷新
offsetX = overScroller.getCurrX();
offsetY = overScroller.getCurrY();
invalidate();
// 没帧动画执行一次，性能更好
postOnAnimation(this);
}
}
}
private void fixOffsets() {
offsetX = Math.min(offsetX, (mBitmap.getWidth() * mBigScale - getWidth()) / 2);
offsetX = Math.max(offsetX, -(mBitmap.getWidth() * mBigScale - getWidth()) / 2);
offsetY = Math.min(offsetY, (mBitmap.getHeight() * mBigScale - getHeight()) / 2);
offsetY = Math.max(offsetY, -(mBitmap.getHeight() * mBigScale - getHeight()) / 2);
}
/**
* 属性动画，设置放大缩小的效果
*/
private ObjectAnimator mScaleAnimator;
private ObjectAnimator getScaleAnimator() {
if (mScaleAnimator == null) {
mScaleAnimator = ObjectAnimator.ofFloat(this, "currentScale", 0);
}
//TODO 解决双指缩放后，点击放大缩小时的动画闪烁问题
if (isScale) {
isScale = false;
mScaleAnimator.setFloatValues(mSmallScale, mCurrentScale);
} else {
//放大缩小的范围
mScaleAnimator.setFloatValues(mSmallScale, mBigScale);
}
return mScaleAnimator;
}
// 属性动画，值会不断地从 smallScale 慢慢 加到 bigScale， 通过反射调用改方法
public void setCurrentScale(float currentScale) {
mCurrentScale = currentScale;
invalidate();
}
//实现双指放大和缩小功能
class PhotoScaleGestureListener extends ScaleGestureDetector.SimpleOnScaleGestureListener{
float initialScale;
@Override
public boolean onScale(ScaleGestureDetector detector) {
if ((mCurrentScale > mSmallScale && !isEnlarge)
|| (mCurrentScale == mSmallScale && isEnlarge)) {
isEnlarge = !isEnlarge;
}
//detector.getScaleFactor() 获取缩放因子
mCurrentScale = initialScale * detector.getScaleFactor();
isScale = true;
invalidate();
return false;
}
// 注意：返回true，消费事件
@Override
public boolean onScaleBegin(ScaleGestureDetector detector) {
initialScale = mCurrentScale;
return true;
}
@Override
public void onScaleEnd(ScaleGestureDetector detector) {
super.onScaleEnd(detector);
}
}
}
- OverScroller 里的 fling 方法参数讲解
/**
*
* @param startX x轴，起始位置
* @param startY Y轴，起始位置
* @param velocityX x轴，速度（可以用 onFling 中的系统速度）
* @param velocityY Y轴，速度（可以用 onFling 中的系统速度）
* @param minX x最小限制条件
* @param maxX x最大限制条件
* @param minY y最小限制条件
* @param maxY y最大限制条件
* @param overX x轴，允许的最大滑动距离（就是可留白的大小）
* @param overY Y轴，允许的最大滑动距离（就是可留白的大小）
*/
public void fling(int startX, int startY, int velocityX, int velocityY,
int minX, int maxX, int minY, int maxY, int overX, int overY) {
}