安卓自定义View进阶-缩放手势检测(ScaleGestureDecetor)

最新推荐文章于 2024-09-09 10:20:35 发布
最新推荐文章于 2024-09-09 10:20:35 发布
阅读量1.8k 收藏 7
点赞数 2
分类专栏： Android自定义view 文章标签： 缩放手势检测(ScaleGestureDecetor)

原文地址：http://www.gcssloop.com/customview/scalegesturedetector

0. 前言

Android 缩放手势检测，ScaleGestureDetector 相关内容的用法和注意事项，本文依旧属于事件处理这一体系，在大多数的情况下，缩放手势都不是单独存在的，需要配合其它的手势来使用，所以推荐配合 手势检测(GestureDetector) 一起观看。如果是用在自定义的控件上，则需要配合 Matrix 相关内容使用起来可能会更加方便，如果对 Matrix 不太熟悉也可以看本系列文章之前的内容来补充一下相关知识。如果你没看过之前的文章，可以到 自定义 View 系列 来查看这些内容。

缩放手势对于大部分 Android 工程师来说，需要用到的机会比较少，它最常见于以下的一些应用场景中，例如：图片浏览，图片编辑(贴图效果)、网页缩放、地图、文本阅读(通过缩放手势调整文字大小)等。应用场景相对比较狭窄，不过肯定也会有一些用武之地，它可以实现如下的效果：

demo-3656658

2.缩放手势检测(ScaleGestureDetector)

缩放手势检测同样是官方提供的手势检测工具，它的使用方式的 GentureDetector 类似，也是通过 Listener 进行监听用户的操作手势，它是对缩放手势进行了一次封装， 可以方便用户快速的完成缩放相关功能的开发。缩放手势相对比较简单，网络上也能查到不少非官方实现的缩放手势计算方案，但部分非官方的方案确实有所局限，例如只支持两个手指的计算，在出现超过两个手指时，只计算了前两个手指的移动，这样显然是不合理的。而官方的这种实现方案轻松的应对了多个手指的情况，下面我们就来看看它是如何实现的吧。

2.1 构造方法

它有两个构造方法，和 GestureDetector 类似，如下所示：

ScaleGestureDetector(Context context, ScaleGestureDetector.OnScaleGestureListener listener)

ScaleGestureDetector(Context context, ScaleGestureDetector.OnScaleGestureListener listener, Handler handler)

2.2 手势监听器

它只有两个监听器，但严格来说，这两个监听器是同一个，只不过一个是接口，另一个是空实现而已。

监听器简介
OnScaleGestureListener缩放手势检测器。
SimpleOnScaleGestureListener缩放手势检测器的空实现。

OnScaleGestureListener

缩放手势监听器有 3 个方法：

方法简介
boolean onScaleBegin(ScaleGestureDetectordetector)缩放手势开始，当两个手指放在屏幕上的时候会调用该方法(只调用一次)。如果返回 false 则表示不使用当前这次缩放手势。
boolean onScale(ScaleGestureDetector detector)缩放被触发(会调用0次或者多次)，如果返回 true 则表示当前缩放事件已经被处理，检测器会重新积累缩放因子，返回 false 则会继续积累缩放因子。
void onScaleEnd(ScaleGestureDetector detector)缩放手势结束。

2.3 简单示例

这是使用 ScaleGestureDetector 的一个极简用例，当然，它没有实现任何功能，只是用日志的方式输出了几个我们比较关心的参数而已。

public class ScaleGestureDemoView extends View {
    private static final String TAG = "ScaleGestureDemoView";

    private ScaleGestureDetector mScaleGestureDetector;

    public ScaleGestureDemoView(Context context) {
        super(context);
    }

    public ScaleGestureDemoView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        initScaleGestureDetector();
    }

    private void initScaleGestureDetector() {
        mScaleGestureDetector = new ScaleGestureDetector(getContext(), new ScaleGestureDetector.SimpleOnScaleGestureListener() {
            @Override
            public boolean onScaleBegin(ScaleGestureDetector detector) {
                return true;
            }

            @Override
            public boolean onScale(ScaleGestureDetector detector) {
                Log.i(TAG, "focusX = " + detector.getFocusX());       // 缩放中心，x坐标
                Log.i(TAG, "focusY = " + detector.getFocusY());       // 缩放中心y坐标
                Log.i(TAG, "scale = " + detector.getScaleFactor());   // 缩放因子
                return true;
            }

            @Override
            public void onScaleEnd(ScaleGestureDetector detector) {
            }
        });
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        mScaleGestureDetector.onTouchEvent(event);
        return true;
    }
}

3. 基本原理

由于缩放手势检测使用起来非常简单，没有什么复杂的内容，不仅如此，它的实现也非常简单，下面我就带大家简单分析一下它的基本原理。在缩放手势中我们其实主要关心的只有两个参数而已，一个是缩放的中心点，另一个就是缩放比例了。 下面我们就看看这两个参数是如何计算出来的.

3.1 计算缩放的中心点(焦点)

如果只有两个手指的话，缩放的中心点自然是非常容易计算的，那就是两个手指坐标的中点，但是如果有多个手指该如何计算缩放的中心点呢？

计算中心点的原理其实也非常简单，那就是将所有的坐标都加起来，然后除以数量即可。

这是一个简单的数学原理，并不复杂，如果有不理解的，自己尝试计算一下也就能明白了。不过在实际运用中还是需要注意一下的， 用户的手指数量可能并不是固定的，用户可能随时抬起来或者按下手指，ScaleGestureDetector 中是这样实现的：

 final boolean anchoredScaleCancelled =
            mAnchoredScaleMode == ANCHORED_SCALE_MODE_STYLUS && !isStylusButtonDown;
    final boolean streamComplete = action == MotionEvent.ACTION_UP ||
            action == MotionEvent.ACTION_CANCEL || anchoredScaleCancelled;

    // 注意这里
    if (action == MotionEvent.ACTION_DOWN || streamComplete) {
		//重置侦听器正在进行的任何缩放。
        //如果是ACTION_DOWN，我们正在开始一个新的事件流。
        //这意味着应用程序可能没有给我们所有的事件(事件被上层直接拦截了)。
        if (mInProgress) {
            mListener.onScaleEnd(this);
            mInProgress = false;
            mInitialSpan = 0;
            mAnchoredScaleMode = ANCHORED_SCALE_MODE_NONE;
        } else if (inAnchoredScaleMode() && streamComplete) {
            mInProgress = false;
            mInitialSpan = 0;
            mAnchoredScaleMode = ANCHORED_SCALE_MODE_NONE;
        }

        if (streamComplete) {
            return true;
        }
    }

可以看到，当触发 down 或者触发 up，cancel 时，如果之前处于缩放计算的状态，会将其状态重置， 并调用 onScaleEnd 方法。

当然， 你可能注意到了 mAnchoredScaleMode 等内容，这些是对触控笔等外设的支持，对于大部分工程师来说，用到的机会比较少， 不管即可。

计算中心点：

final boolean configChanged = action == MotionEvent.ACTION_DOWN ||
        action == MotionEvent.ACTION_POINTER_UP ||
        action == MotionEvent.ACTION_POINTER_DOWN || anchoredScaleCancelled;

// 注意这里
final boolean pointerUp = action == MotionEvent.ACTION_POINTER_UP;
final int skipIndex = pointerUp ? event.getActionIndex() : -1;

// 确定焦点
float sumX = 0, sumY = 0;
final int div = pointerUp ? count - 1 : count;
final float focusX;
final float focusY;
if (inAnchoredScaleMode()) {
    // 在锚定比例模式下，焦点始终是双击或按钮按下时手势开始的位置
    focusX = mAnchoredScaleStartX;
    focusY = mAnchoredScaleStartY;
    if (event.getY() < focusY) {
        mEventBeforeOrAboveStartingGestureEvent = true;
    } else {
        mEventBeforeOrAboveStartingGestureEvent = false;
    }
} else {
	// 注意这里， 最终计算得到焦点
    for (int i = 0; i < count; i++) {
        if (skipIndex == i) continue;
        sumX += event.getX(i);
        sumY += event.getY(i);
    }

    focusX = sumX / div;
    focusY = sumY / div;
}

3.2 计算缩放比例

计算缩放比例也很简单，就是计算各个手指到焦点的平均距离，在用户手指移动后用新的平均距离除以旧的平均距离，并以此计算得出缩放比例。

// 计算到焦点的平均距离
float devSumX = 0, devSumY = 0;
for (int i = 0; i < count; i++) {
    if (skipIndex == i) continue;
    devSumX += Math.abs(event.getX(i) - focusX);
    devSumY += Math.abs(event.getY(i) - focusY);
}
final float devX = devSumX / div;
final float devY = devSumY / div;

// 注意这里
final float spanX = devX * 2;
final float spanY = devY * 2;
final float span;
if (inAnchoredScaleMode()) {
    span = spanY;
} else {
    // 相当于 sqrt(x*x + y*y)
    span = (float) Math.hypot(spanX, spanY);
}

当用户移动的距离超过一定数值(数值大小由系统定义)后，会触发 onScaleBegin 方法，如果用户在 onScaleBegin 方法里面返回了 true，表示接受事件后，就会重置缩放相关数值，并且开始积累缩放因子。

// mSpanSlop 和 mMinSpan 都是从系统里面取得的预定义数值，该数值实际上影响的是缩放的灵敏度。
// 不过该参数并没有提供设置的方法，如果对灵敏度不满意的话，和通过直接之际复制一个 ScaleGestureDetector 到项目中， 并且修改其中的数值。
final int minSpan = inAnchoredScaleMode() ? mSpanSlop : mMinSpan;
if (!mInProgress && span >=  minSpan &&
        (wasInProgress || Math.abs(span - mInitialSpan) > mSpanSlop)) {
    mPrevSpanX = mCurrSpanX = spanX;
    mPrevSpanY = mCurrSpanY = spanY;
    mPrevSpan = mCurrSpan = span;
    mPrevTime = mCurrTime;
    mInProgress = mListener.onScaleBegin(this);
}

通知用户缩放：

if (action == MotionEvent.ACTION_MOVE) {
    mCurrSpanX = spanX;
    mCurrSpanY = spanY;
    mCurrSpan = span;

    boolean updatePrev = true;

    if (mInProgress) {
        // 注意这里，用户的返回值决定了是否重新计算缩放因子
        updatePrev = mListener.onScale(this);
    }

    // 如果用户返回了 true ，就会重新计算缩放因子
    if (updatePrev) {
        mPrevSpanX = mCurrSpanX;
        mPrevSpanY = mCurrSpanY;
        mPrevSpan = mCurrSpan;
        mPrevTime = mCurrTime;
    }
}

4. 后记

由于缩放手势检测确实比较简单，没什么好讲的内容，如果看了上面的内容依旧有疑惑的话，推荐去看一下源码，源码的逻辑也非常简洁明了，相信看完之后也就能够彻底理解它的原理了。

最后附上文章一开始展示所用图片的源代码，点击下载项目获取源代码。

下载项目

天凉好个秋·
关注
专栏目录
Android手势监测-GestureDector
s740088128的专栏
09-09 1551
在自定义view的时候,我们通常通过重写他的onTouch(View v, MotionEvent event)方法，我们可以处理一些touch事件，但是对于一些比较复杂的手势,我们如果自己去通过MotionEvent来自己判断的话会有一些复杂和不准确,所以Android为我们提供了GestureDector类来方便我们进行手势的监听处理. GestureDector为我们提供了两个接口和一个静
Android学习札记20：ScaleGestureDetector
L_YQing的专栏
07-02 1268
类概述     根据接收的 MotionEven，侦测由多个触点（多点触控）引发的变形手势。callback 方法ScaleGestureDetector.OnScaleGestureListener会在特定手势事件发生时通知用户。该类仅能和Touch事件引发的 MotionEvent 配合使用。     使用该类需要为你的View创建ScaleGestureDetector实例     确
Android 手把手进阶自定义View（十二）- 缩放手势检测 ScaleGestureDetector
lerendan的博客
04-01 1462
一、前言 Android 缩放手势检测 ScaleGestureDetector，在大多数的情况下缩放手势都不是单独存在的，需要配合其它的手势来使用，如果是用在自定义的控件上，则需要配合 Matrix 相关内容使用起来可能会更加方便。缩放手势最常见于以下的一些应用场景中，例如：图片浏览，网页缩放、地图等。 二、缩放手势检测 缩放手势检测同样是官方提供的手势检测工具，它的使用方式的 Ge...
Android手势缩放功能实现详解
最新发布
weixin_30951515的博客
09-09 1061
本文还有配套的精品资源，点击获取 简介：Android开发中，手势识别是关键交互技术，尤其在触摸屏应用设计中。本教程详细探讨了如何利用MotionEvent类、ScaleGestureDetector类、ImageView的Matrix属性、GestureDetector.OnGestureListener接口等技术实现手势控制的图片或其他元素缩放功能。同时，还包括了动画效...
Android之ScaleGestureDetector（缩放手势检测）
weixin_33910759的博客
10-25 473
一、概述       ScaleGestureDetector这个类是专门用来检测两个手指在屏幕上做缩放的手势用的，最简单的应用就是用来缩放图片或者缩放网页。 二、要求      利用ScaleGestureDetector这个类实现图片缩放。 三、实现      新建工程MyScale，修改main.xml文件，在里面添加一个Button和一个SurfaceVi...
android 自定义view缩放,Android中自定义View支持缩放
weixin_42505246的博客
05-25 385
参考网址：https://blog.csdn.net/zqurapig/article/details/83414389https://blog.csdn.net/u010648159/article/details/80854797public class ScaleGestureDemoView extends View {private static final String TAG = "...
Android---缩放View
FireOfStar的专栏
09-21 4559
本文译自：http://developer.android.com/training/animation/zoom.html 本文向你介绍如何制作触碰缩放动画，对于像相册这样的应用程序，让图片在缩略图和全屏显示之间具有动画行为，会具有更好的用户体验。 创建View 给要缩放的内容创建大小两个版本的布局文件。下例中给可点击的图片缩略图创建了一个ImageButton布局和一个用于显示大图片的I
Android view设置缩放
weixin_40327204的博客
08-08 128
Android View 设置缩放 在Android开发中，视图的缩放是用户交互体验中一个重要的环节。通过对视图进行缩放，可以增强用户对应用的使用体验，尤其是在图像和图表的展示中尤为重要。本文将探讨如何在Android中实现视图的缩放功能，并提供详细的代码示例，以帮助开发者更好地掌握这一技巧。 1. 缩放的基本概念 缩放可...
缩放手势 ScaleGestureDetector 源码解析，这一篇就够了
weixin_30868855的博客
06-28 617
其实在我们日常的编程中，对于缩放手势的使用并不是很经常，这一手势主要是用在图片浏览方面，比如下方例子。但是（敲重点），作为 Android 入门的基础来说，学习 ScaleGestureDetector 的使用，算是不得不过的一道坎，好在 ScaleGestureDetector 使用起来非常简单，就是源码分析上得花些功夫。 本文首先将简单的介绍下 ScaleGestureDetector 的使...
Android自定义view---手势识别，双击，惯性滑动，相册图片效果
lbj23vs6的博客
10-04 1318
文章目录前言一、GestureDetectorCompat是什么？二、使用步骤1.定义一个GestureDetectorCompat的实例2.重写方法，实现自定义效果①想让检测器消费一系列的触摸事件，那么就要在重写方法`onDown`中去返回true，那么后续的一系列触摸过程才能让手势检测器获取②既然我们要去实现双击效果，那么就得再给手势检测器设置一个监听③实现双击变大变小④重写onDoubleTap④实现惯性滑动总结完整代码 前言 在view中我们可以重写onTouchEvent来自定义点击事件，但是M
安卓自定义View进阶-Matrix原理
GcsSloop
08-03 3980
Matrix 是一个在后台默默辛苦工作的劳模，我们经常看到它的劳动成果，却很少见到 Matrix，就让我们借助本篇文章来探访一下 Matrix 都做了哪些工作，是如何工作的。
安卓自定义View进阶-Canvas之画布操作
热门推荐
GcsSloop
01-28 1万+
上一篇【Canvas 之绘制基本形状】中我们了解了如何使用 Canvas 绘制基本图形，本次了解一些基本的画布操作。合理的使用画布操作可以帮助你用更容易理解的方式创作想要的效果。
安卓自定义View进阶-手势检测(GestureDetector)
天凉好个秋
10-30 2781
原文地址：http://www.gcssloop.com/customview/gestruedector Android 手势检测，主要是 GestureDetector 相关内容的用法和注意事项，本文依旧属于事件处理这一体系，部分内容会涉及到之前文章提及过的知识点，如果你没看过之前的文章，可以到自定义 View 系列来查看这些内容。 在开发 Android 手机应用过程中，可能需要对一...
安卓自定义View进阶-Canvas之绘制基本形状
GcsSloop
01-21 1万+
在上一篇自定义 View 分类与流程中我们了解自定义 View 相关的基本知识，不过，这些东西依旧还是理论，并不能拿来 (zhuang) 用(B), 这一次我们就了解一些能 (zhaung) 用(B)的东西。 在本篇文章中，我们先了解 Canvas 的基本用法，最后用一个小示例来结束本次教程。
android view整体缩放
weixin_40880076的博客
07-08 72
代码示例相关视频讲解：数组-Go代码演示Android View整体缩放实现 1. 流程 journey title 整体缩放实现流程 section 开发者指导小白 开始 --> 了解需求 了解需求 --> 查阅资料 查阅资料 --> 实...
ScaleGestureDetector
AdrianAndroid的专栏
07-17 1109
// 用于处理缩放的工具类，用法与GestureDetector类似，都是通过onTouchEvent关联相应的MotionEvent。 // 使用该类时，用户需要拆入一个完整的连续不断的motion事件（包含ACTION_DOWN，ACTION_MOVE和ACTION_UP事件） final ScaleGestureDetector scaleGestureDetector = new ScaleGestureDetector(this, new ScaleGestureDetector.
Android中自定义View支持缩放
aidou1314的博客
06-22 1193
参考网址：https://blog.csdn.net/zqurapig/article/details/83414389 public class ScaleGestureDemoView extends View { private static final String TAG = "ScaleGestureDemoView"; private ScaleGestureDetector mScaleGestureDetector; public ScaleGestur
GestureDetector ScaleGestureDetector
qqmuhua123的专栏
03-07 317
Android提供了一个GestureDetector来帮助我们识别一些基本的触摸手势（还有ScaleGestureDetector可以识别缩放手势）注意  针对特殊的触摸手势可以通过GestureDetector实现监听，但是对于复杂的还需要自己实现。来监听手势，点击，长按，双击，滚动，抛等。如果我们想自定义手势  这个时候可以参考GestureDetector里面的源码进而实现自己的手势监听。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值