Flutter进阶篇(3)-- Flutter 的手势(GestureDetector)分析详解

声明:本文是作者AWeiLoveAndroid原创,版权归作者AWeiLoveAndroid所有,侵权必究。如若转发,请注明作者和来源地址!未经授权,严禁私自转载!

今天详细讲解一下Flutter中的GestureDetector。


Flutter系列博文链接 ↓:

工具安装:

Flutter基础篇:

Flutter进阶篇:

Dart语法系列博文链接 ↓:

Dart语法基础篇:

Dart语法进阶篇:


目录:

一、手势识别器分类
二、手势识别器的相关闭包函数统计分析
三、各种手势识别器的使用详解
四、手势识别器混合使用
五、手势识别器使用时遇到的坑



一、手势识别器分类

GestureDetector手势操作是开发中必不可少的,Flutter中的GestureDetector一共有 7大类25种

分别是:

Tap:

onTapDown: (details) {},
onTapUp: (details) {},
onTap: () {},
onTapCancel: () {},

双击:

onDoubleTap: () {},

长按:

onLongPress: () {},
onLongPressStart: () {},
onLongPressMoveUpdate: () {},
onLongPressUp: () {},
onLongPressEnd: () {},

垂直滑动:

onVerticalDragDown: (details) {},
onVerticalDragStart: (details) {},
onVerticalDragUpdate: (details) {},
onVerticalDragEnd: (details) {},
onVerticalDragCancel: () {},

水平滑动:

onHorizontalDragDown: (details) {},
onHorizontalDragStart: (details) {},
onHorizontalDragUpdate: (details) {},
onHorizontalDragEnd: (details) {},
onHorizontalDragCancel: () {},

Pan事件:

指针已接触屏幕并可能开始移动。
onPanDown: (details) {},
指针已经接触屏幕并开始移动。
onPanStart: (details) {},
与屏幕接触并移动的指针再次移动。
onPanUpdate: (details) {}, 
先前与屏幕接触并移动的指针不再与屏幕接触,并且当它停止接触屏幕时以特定速度移动。
onPanEnd: (details) {},
先前触发 onPanDown 的指针未完成。
onPanCancel: () {},

Scale事件:

onScaleStart: (details) {},
onScaleUpdate: (details) {},
onScaleEnd: (details) {},

二、手势识别器的相关闭包函数统计分析表:

我查看了一下每一个事件类型源码,做了一张图,如下所示:

手势识别器最新内容.png

我们可以得到几点信息:

还有 64% 的精彩内容

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 136,186评论 17 580
  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 8,116评论 2 45
  • 在iOS开发中经常会涉及到触摸事件。本想自己总结一下,但是遇到了这篇文章,感觉总结的已经很到位,特此转载。作者:L...
    WQ_UESTC阅读 2,040评论 0 7
  • 好奇触摸事件是如何从屏幕转移到APP内的?困惑于Cell怎么突然不能点击了?纠结于如何实现这个奇葩响应需求?亦或是...
    Lotheve阅读 23,652评论 40 377
  • 最近读书不再追求速度,每天只是简单的从书中汲取一两句话,便也觉得有了很大的进步。书中的语言给我带来的力量与宁静使得...
    杨福荣阅读 3,434评论 0 0