Flutter:触控事件处理和通知摘要

一、触控事件处理:

1.Listener监听触控事件:

(1)使用:

Listener( //Listener也是Widget
  child: ...,   //省略需要添加触控事件的Widget
  onPointerDown: (PointerDownEvent event) { //手指按下时触发
    ... //此处处理按下逻辑
  },
  onPointerMove: (PointerMoveEvent event) { //手指移动时触发
    ... //此处处理移动逻辑
  },
  onPointerUp: (PointerUpEvent event) { //手指抬起时触发
    ... //此处处理抬起逻辑
  }
);

(2)event字段说明:

double orientation = event.orientation;  //移动方向
double localDx = event.localPosition.dx; //相对本身布局坐标的x轴偏移
double localDy = event.localPosition.dy; //相对本身布局坐标的y轴偏移
double posDx = event.position.dx;        //相对全局坐标的x轴偏移
double posDy = event.position.dy;        //相对全局坐标的y轴偏移
double dx = event.delta.dx;              //x轴移动距离
double dy = event.delta.dy;              //y轴移动距离

(3)忽略触控事件:

AbsorbPointer( //忽略触控事件
  child: Listener(...)  //Listener内的方法不会触发
);
或
IgnorePointer( //忽略触控事件
  child: Listener(...) //Listener内的方法不会触发
);

2.GestureDetector监听触控事件:

(1)使用:

GestureDetector(
  child: ...,  //省略需要添加触控事件的Widget
  onTap: () { //点击时触发
  },
  onDoubleTap: () { //双击时触发
  },
  onLongPress: () { //长按时触发
  },
  onPanDown: (DragDownDetails event) { //手指按下时触发
    double absoluteX = event.globalPosition.dx;  //按下的位置相对于屏幕原点(左上角)的x轴偏移量
    double absoluteY = event.globalPosition.dy;  //按下的位置相对于屏幕原点(左上角)的y轴偏移量
  },
  onPanUpdate: (DragUpdateDetails event) { //手指滑动时触发
    double distanceX = event.delta.dx;  //从按下到单次滑动结束的x轴距离
    double distanceY = event.delta.dy;  //从按下到单次滑动结束的y轴距离
  },
  onPanEnd: (DragEndDetails event){ //手指滑动结束时触发
    double velocityX = event.velocity.pixelsPerSecond.dx;  //抬起手指时的x轴滑动速度
    double velocityY = event.velocity.pixelsPerSecond.dx;  //抬起手指时的y轴滑动速度
  },
  onScaleUpdate: (ScaleUpdateDetails details) { //两个手指缩放时触发,不能与其他方法同时监听,会报错
      double scale = details.scale.clamp(0.8, 10);   //设置缩放上下限,前个参数为下限,后个参数为上限
  },
);

(2)event字段说明:

double absoluteX = DragDownDetails.globalPosition.dx;  //onPanDown方法,按下的位置相对于屏幕原点(左上角)的x轴
偏移量
double absoluteY = DragDownDetails.globalPosition.dy;  //onPanDown方法,按下的位置相对于屏幕原点(左上角)的y轴
偏移量
double distanceX = DragUpdateDetails.delta.dx;  //onPanUpdate方法,从按下到单次滑动结束的x轴距离
double distanceY = DragUpdateDetails.delta.dy;  //onPanUpdate方法,从按下到单次滑动结束的y轴距离
double velocityX = DragEndDetails.velocity.pixelsPerSecond.dx;  //onPanEnd方法,抬起手指时的x轴滑动速度
double velocityY = DragEndDetails.velocity.pixelsPerSecond.dx;  //onPanEnd方法,抬起手指时的y轴滑动速度
double 缩放倍数 = details.scale.clamp(缩小下限值, 放大上限值);   //设置缩放上下限

3.TapGestureRecognizer与指定Widget配合监听触控事件:

TapGestureRecognizer _GestureRecognizer = TapGestureRecognizer();
...
Text.rich(TextSpan(
    text: "...",
    recognizer: _GestureRecognizer..onTap = () {  //传入Widget,监听点击事件
      ...  //处理点击事件
    },
));
...
@override
void dispose() {
  _GestureRecognizer.dispose();  //释放
  super.dispose();
}

二、通知Notification:

1.监听系统通知:

(1)使用NotificationListener监听系统通知:

NotificationListener( //监听此Widget所有通知,NotificationListener也是Widget
//NotificationListener<ScrollStartNotification>( //只监听此类型的通知
  onNotification: (notification) {
    //notification.runtimeType;  //获取通知类型,例如ListView的ScrollStartNotification开始滚动、
ScrollUpdateNotification滚动中、ScrollEndNotification停止滚动、OverscrollNotification滚到边界等
    return true; //true时终止向上通知,false时继续向上通知
  },
  child: ...,  //监听此Widget的通知事件
)

2.使用自定义通知:

(1)定义通知类:

class CustomNotification extends Notification { //继承Notification类
  CustomNotification(this.message);
  String message; //自定义属性
}

(2)使用自定义通知:

...
NotificationListener<CustomNotification>( //监听自定义通知,NotificationListener也是Widget
  onNotification: (notification) {
    String message = notification.message; //获取自定义通知中的自定义属性
    ...
  },
  child: ...,  //监听此Widget的通知事件
)
...
CustomNotification("通知内容").dispatch(context); //发送自定义通知


 

猜你喜欢

转载自blog.csdn.net/a526001650a/article/details/127925135