Flutter:如何响应触摸事件

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

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

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

1. Listener 的经常使用属性

看看经过 Listener 能够处理哪些事件:post

属性 类型 说明
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 的使用

先看看例子🌰:spa

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 节点,就至关于使节点得到处理事件的能力。3d

1.2 HitTestBehavior

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

  • HitTestBehavior.deferToChildcode

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

  • HitTestBehavior.opaqueblog

    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

相关文章
相关标签/搜索