Flutter进阶篇（3）-- Flutter 的手势（GestureDetector）分析详解

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

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

---

Flutter系列博文链接 ↓：

工具安装：

• Flutter从配置安装到填坑指南详解

Flutter基础篇：

• Flutter基础篇（1）-- 跨平台开发框架和工具集锦
• Flutter基础篇（2）-- 老司机用一篇博客带你快速熟悉Dart语法
• Flutter基础篇（3）-- Flutter基础全面详解
• Flutter基础篇（4）-- Flutter填坑全面总结
• Flutter基础篇（5）-- Flutter代码模板，解放双手，提高开发效率必备
• Flutter基础篇（6）-- 水平和垂直布局详解
• Flutter基础篇（7）-- Flutter更新错误全面解决方案(图文+视频讲解)

Flutter进阶篇：

• Flutter进阶篇（1）-- 手把手带你快速上手调试Flutter项目
• Flutter进阶篇（2）-- Flutter路由详解
• Flutter进阶篇（3）-- Flutter 的手势（GestureDetector）分析详解
• Flutter进阶篇（4）-- Flutter的Future异步详解

Dart语法系列博文链接 ↓：

• Flutter基础篇（2）-- 老司机用一篇博客带你快速熟悉Dart语法(这是Dart语法系列的第一篇)
• Dart的语法详解系列篇（二）-- 类与函数
• Dart的语法详解系列篇（三）-- mixin入门
• Dart的语法详解系列篇（四）-- 泛型、异步、库等有关详解

---

目录：

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

---

---

一、手势识别器分类

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

分别是：

Tap：

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

双击：

onDoubleTap: () {},

长按：

onLongPress: () {},
onLongPressUp: () {},

垂直滑动：

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) {},

---

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

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

我们可以得到几点信息：