Flutter:如何响应触摸事件

目录传送门：《Flutter快速上手指南》先导篇

除了 GestureDetector，Flutter 还提供了 Listener 来监听触摸事件。

它也是一个 Widget，使用它包裹一个 Widget，就能能够处理该 Widget 上发生的触摸事件。

1. Listener 的常用属性

看看通过 Listener 可以处理哪些事件：

属性	类型	说明
onPointerDown	(PointerDownEvent event){}	按下时触发
onPointerMove	(PointerDownEvent event){}	移动时触发
onPointerEnter	(PointerDownEvent event){}	进入Widget区域时触发
onPointerExit	(PointerDownEvent event){}	离开Widget区域时触发
onPointerUp	(PointerDownEvent event){}	离开屏幕时触发
onPointerDown	(PointerDownEvent event){}	按下时触发
onPointerCancel	(PointerDownEvent event){}	取消触摸时触发
behavior	HitTestBehavior	控制事件传递。这个下面再说明

1.1 Listener 的使用

先看看例子?：

Listener(
  onPointerUp: (e){
    Navigator.pop(context);
  },
  child: Container(
    height: 80,
    color: Colors.blue,
    alignment: Alignment.center,
    child: Text(
      text,
      style: TextStyle(
          color: Colors.white, decoration: TextDecoration.none),
    ),
  ),
)
复制代码

还是那套用法，使用它去包裹要处理事件的 Widget 节点，就相当于使节点获得处理事件的能力。

1.2 HitTestBehavior

HitTestBehavior 用于控制事件的传递方式。

• HitTestBehavior.deferToChild

  只有有子 Widget 通过了 Hit-Test，才接收一系列的事件，接收区域也会被限制在该子 Widget 区域中。

• HitTestBehavior.opaque

  Widget 能够通过 Hit-Test，接收事件，且能阻止在它之前的 Widget（直观来看就是被它挡住的 Widget）接收事件。

  简单来说就是事件 不能透传。

• HitTestBehavior.translucent

  Widget 能够通过 Hit-Test，接收事件，且不会阻止它之前的 Widget（直观来看就是被它挡住的 Widget）接收事件。

  简单来说就是事件 能透传。

1.3 PointerEvent

PointerEvent 是 Listener 回调中的参数，储存了一系列的触摸信息。

看看一些比较常用的属性：

属性	类型	说明
pointer	int	标示一次触摸id。重新触摸会分配新的值
kind	PointerDeviceKind	触摸事件的输入类型。是触摸，还是鼠标..
position	Offset	当前坐标。相对于全局坐标
delta	Offset	指针移动期间，与上一次事件的移动距离
pressure	double	按压力度。取值范围 0.0-1.0

2.不接收触摸事件 - IgnorePointer

如果不想让一个 Widget 接收触摸事件，那就用 IgnorePointer 包裹它好了。

IgnorePointer(
   ignoring: true,
   child: MyWidget(),
)
复制代码

使用比较简单，ignoring 控制是否忽略，默认为 true。

目录传送门：《Flutter快速上手指南》先导篇

如何找到我？

传送门：CoorChice 的主页

传送门：CoorChice 的 Github

转载于:https://juejin.im/post/5ca81f28e51d4577a532b893