轻触、拖动和其他手势

本文档说明如何在 Flutter 中侦听手势并对其做出响应。手势的示例包括轻触、拖动和缩放。

Flutter 中的手势系统有两层。第一层具有原始指针事件,描述了指针(例如,触摸、鼠标和触控笔)在屏幕上的位置和移动。第二层具有手势,描述由一个或多个指针移动组成的语义动作。

指针

指针表示用户与设备屏幕交互的原始数据。有四种类型的指针事件

PointerDownEvent
指针已在特定位置接触屏幕。
PointerMoveEvent
指针已从屏幕上的一个位置移动到另一个位置。
PointerUpEvent
指针已停止接触屏幕。
PointerCancelEvent
此指针的输入不再指向此应用。

在指针按下时,框架会在你的应用上进行命中测试,以确定指针接触屏幕的位置处存在哪个小部件。然后,指针按下事件(以及该指针的后续事件)将分派到命中测试找到的最内层小部件。从那里,事件会冒泡到树中,并分派到从最内层小部件到树根路径上的所有小部件。没有机制可以取消或阻止指针事件进一步分派。

要直接从小部件层侦听指针事件,请使用 Listener 小部件。但是,通常考虑使用手势(如下所述)。

手势

手势表示从多个单独的指针事件(甚至可能是多个单独的指针)识别的语义动作(例如,轻击、拖动和缩放)。手势可以分派多个事件,对应于手势的生命周期(例如,拖动开始、拖动更新和拖动结束)

轻击

onTapDown
可能导致轻击的指针已在特定位置接触屏幕。
onTapUp
触发轻击的指针已停止在特定位置接触屏幕。
onTap
先前触发 onTapDown 的指针也触发了 onTapUp,最终导致轻击。
onTapCancel
先前触发 onTapDown 的指针不会最终导致轻击。

双击

onDoubleTap
用户在短时间内连续两次轻击同一位置的屏幕。

长按

onLongPress
指针已在同一位置长时间与屏幕保持接触。

垂直拖动

onVerticalDragStart
指针已接触屏幕,可能开始垂直移动。
onVerticalDragUpdate
与屏幕接触并垂直移动的指针已在垂直方向移动。
onVerticalDragEnd
先前与屏幕接触并垂直移动的指针不再与屏幕接触,并且在停止接触屏幕时以特定速度移动。

水平拖动

onHorizontalDragStart
指针已接触屏幕,并可能开始水平移动。
onHorizontalDragUpdate
与屏幕接触并水平移动的指针已在水平方向移动。
onHorizontalDragEnd
先前与屏幕接触并水平移动的指针已不再与屏幕接触,且在停止接触屏幕时以特定速度移动。

平移

onPanStart
指针已接触屏幕,并可能开始水平或垂直移动。如果设置了 onHorizontalDragStartonVerticalDragStart,此回调将崩溃。
onPanUpdate
与屏幕接触并以垂直或水平方向移动的指针。如果设置了 onHorizontalDragUpdateonVerticalDragUpdate,此回调将崩溃。
onPanEnd
先前与屏幕接触的指针已不再与屏幕接触,且在停止接触屏幕时以特定速度移动。如果设置了 onHorizontalDragEndonVerticalDragEnd,此回调将崩溃。

向小组件添加手势检测

要侦听小组件图层的手势,请使用 GestureDetector

如果您使用的是 Material Components,其中许多小组件已响应轻触或手势。例如,IconButtonTextButton 响应按压(轻触),ListView 响应滑动以触发滚动。如果您不使用这些小组件,但希望在轻触时出现“墨水飞溅”效果,可以使用 InkWell

手势消除歧义

在屏幕上的给定位置,可能有多个手势检测器。例如

  • 一个 ListTile 具有一个点击识别器,该识别器对整个 ListTile 做出响应,并且在尾随图标按钮周围嵌套了一个识别器。尾随图标的屏幕矩形现在由两个手势识别器覆盖,如果手势最终变成点击,则需要协商由谁来处理手势。
  • 一个 GestureDetector 覆盖一个屏幕区域,该区域配置为处理多个手势,例如长按和点击。当用户触摸屏幕的该部分时,tap 识别器现在必须与 long press 识别器协商。根据接下来指针发生的情况,两个识别器之一接收手势,或者如果用户执行既不是点击也不是长按的操作,则两个识别器都不接收手势。

所有这些手势检测器都会监听指针事件流,因为它们会流过并尝试识别特定手势。 GestureDetector 小部件根据其哪些回调不是空值来决定尝试识别哪些手势。

当屏幕上给定指针有多个手势识别器时,框架会通过让每个识别器加入手势竞技场来消除用户意图的歧义。手势竞技场使用以下规则确定哪个手势获胜

  • 在任何时候,识别器都可以消除自身并离开竞技场。如果竞技场中只有一个识别器,则该识别器获胜。

  • 在任何时候,识别器都可以宣告自己是胜利者,导致所有剩余的识别器都失败。

例如,在消除水平和垂直拖动的歧义时,当两个识别器接收到指针按下事件时,它们都会进入竞技场。识别器会观察指针移动事件。如果用户将指针水平移动一定数量的逻辑像素,则水平识别器宣布获胜,并且手势被解释为水平拖动。类似地,如果用户垂直移动一定数量的逻辑像素,则垂直识别器会宣告自己是胜利者。

当只有一个水平(或垂直)拖动识别器时,手势竞技场是有益的。在这种情况下,竞技场中只有一个识别器,并且立即识别出水平拖动,这意味着第一个水平移动像素可以被视为拖动,并且用户无需等待进一步消除手势歧义。