Flutter手势识别Widget

前言

我们在前面用到 RaisedButton 中 onPressed 来响应点击事件,但是在 Text 中没有 onPressed 属性,那么如何监听 Text 的点击事件呢?在 Flutter 中那就需要使用专门处理手势事件的 Widget 来嵌套 Text,来实现点击事件。

手势识别的 Widget--GestureDetector

GestureDetector 是用于检测手势的 Widget。

  • 使用:只要用 GestureDetector 嵌套要检测手势的 Widget 就行,然后在 GestureDetector 里实现想要监听的手势的方法就行。
  • 代码示例:
GestureDetector(
    child: Text('Hello Flutter'),
    onTap: (){
        print('tab Text');
    },
)
  • GestureDetector 的构造函数及参数说明:
class GestureDetector extends StatelessWidget {
  GestureDetector({
    Key key, // 可选;类型 Key;Widget 的标识
    this.child, // 可选;类型 Widget;要检测手势事件的 Widget
    this.onTapDown, // 可选;类型 GestureTapDownCallback;手指触摸屏幕时产生 onTapDown 事件
    this.onTapUp, // 可选;类型 GestureTapDownCallback;手指离开屏幕时产生 onTapUp 事件,之后便会触发 onTap 事件
    this.onTap, // 可选;类型 GestureTapCallback;点击事件
    this.onTapCancel, // 可选;类型 GestureTapCancelCallback;当触发 onTapDown 之后,取消点击,则会触发 onTapCancel,后面的 onTapDown 和 onTapUp 都不会再触发
    this.onDoubleTap, // 可选;类型 GestureTapCallback;双击事件
    this.onLongPress, // 可选;类型 GestureLongPressCallback;长按屏幕时触发,当监听了 onLongPress 事件时,则不能监听 
    this.onLongPressUp, // 可选;类型 GestureLongPressUpCallback;长按屏幕,手指离开屏幕时触发,当监听了 onLongPressUp 事件时,则不能监听 onLongPressDragStart、onLongPressDragUpdate、onLongPressDragUp
    this.onLongPressDragStart, // 可选;类型 GestureLongPressDragStartCallback;长按屏幕,并准备开始拖动时触发,当监听了 onLongPressDragStart 事件时,则不能监听onLongPress、onLongPressUp
    this.onLongPressDragUpdate, // 可选;类型 GestureLongPressDragUpdateCallback;长按屏幕后并拖动时触发,当监听了 onLongPressDragUpdate 事件时,则不能监听 onLongPress、onLongPressUp
    this.onLongPressDragUp, // 可选;类型 GestureLongPressDragUpCallback;长按屏幕拖动,手指离开屏幕时触发,当监听了 onLongPressDragUp 事件时,则不能监听 onLongPress、onLongPressUp
    this.onVerticalDragDown, // 可选;类型 GestureDragDownCallback;手指接触屏幕,并且可能会开始垂直移动时触发
    this.onVerticalDragStart, // 可选;类型 GestureDragStartCallback;手指接触屏幕,并且已经开始垂直移动时触发
    this.onVerticalDragUpdate, // 可选;类型 GestureDragUpdateCallback;手指接触屏幕,并且垂直移动时触发
    this.onVerticalDragEnd, // 可选;类型 GestureDragEndCallback;手指接触屏幕垂直移动,然后手指离开屏幕时触发
    this.onVerticalDragCancel, // 可选;类型 GestureDragCancelCallback;当 onVerticalDragDown 没有完成时就会触发 onVerticalDragCancel
    this.onHorizontalDragDown, // 可选;类型 GestureDragDownCallback;手指接触屏幕,并且可能会开始水平移动时触发
    this.onHorizontalDragStart, // 可选;类型 GestureDragStartCallback;手指接触屏幕,并且已经开始水平移动时触发
    this.onHorizontalDragUpdate, // 可选;类型 GestureDragUpdateCallback;手指接触屏幕,并且水平移动时触发
    this.onHorizontalDragEnd, // 可选;类型 GestureDragEndCallback;手指接触屏幕水平移动,然后手指离开屏幕时触发
    this.onHorizontalDragCancel, // 可选;类型 GestureDragCancelCallback;当 onHorizontalDragDown 没有完成时就会触发 onHorizontalDragCancel
    this.onForcePressStart,// 可选;类型 GestureForcePressStartCallback;手指与屏幕接触,并且当有足够的压力时才会触发,注意,这个事件仅在具有压力检测屏幕的设备上触发。
    this.onForcePressPeak, // 可选;类型 GestureForcePressPeakCallback;手指与屏幕接触,并且当有压力达到最大时触发,注意,这个事件仅在具有压力检测屏幕的设备上触发。
    this.onForcePressUpdate, // 可选;类型 GestureForcePressUpdateCallback;手指与屏幕接触,有足够的压力并在屏幕上移动时触发,注意,这个事件仅在具有压力检测屏幕的设备上触发。
    this.onForcePressEnd, // 可选;类型 GestureForcePressEndCallback;手指与屏幕分开时触发,注意,这个事件仅在具有压力检测屏幕的设备上触发。
    this.onPanDown, // 可选;类型 GestureDragDownCallback;手指与屏幕接触,并且可能开始移动时触发
    this.onPanStart, // 可选;类型 GestureDragStartCallback;手指与屏幕接触,并且开始移动时触发
    this.onPanUpdate, // 可选;类型 GestureDragUpdateCallback;手指在屏幕上移动时触发
    this.onPanEnd, // 可选;类型 GestureDragEndCallback;手指离开屏幕时触发
    this.onPanCancel, // 可选;类型 GestureDragCancelCallback    ;当 onPanDown 没有完成时触发 onPanCancel
    this.onScaleStart, // 可选;类型 GestureTapDownCallback;手指与屏幕接触,并且即将有缩放操作时触发,初始值为 1.0
    this.onScaleUpdate, // 可选;类型 GestureTapDownCallback;手指与屏幕接触,并且有缩放操作时触发
    this.onScaleEnd, // 可选;类型 GestureTapDownCallback;onScaleStart 之后,手指离开屏幕时触发
    this.behavior, // 可选;类型 HitTestBehavior;在命中测试期间,此手势检测器应如何表现
    this.excludeFromSemantics = false, // 可选;类型 bool;是否从语义树中排除这些手势
    this.dragStartBehavior = DragStartBehavior.down, // 可选;类型 DragStartBehavior;确定处理拖动开始行为的方式。
  })
  ...
}

你可能感兴趣的:(Flutter手势识别Widget)