Flutter | 手势操作可能遇到的一些问题及其解决

概要

  • Pan和Scale不能同时使用;
  • 垂直和水平事件不能同时使用;
  • 双击事件要获取点击坐标,需要Pan事件


Pan和Scale不能同时使用

代码:
Flutter | 手势操作可能遇到的一些问题及其解决_第1张图片
GestureDetector(
          child:
          Text(
            '手势操作遇到问题的测试',
            style:TextStyle(color: Colors.orangeAccent, fontSize: 20),
          ),
          /*********************** Pan事件 *****************************/
          onPanDown: (DragDownDetails details){
            print(''
                'onPanDown  点击处的坐标为:${details.globalPosition}  '
                'x轴:${details.globalPosition.dx}   y轴坐标: ${details.globalPosition.dy}');
          },
          onPanStart: (DragStartDetails details){
            print(''
                'onPanStart  点击处的坐标为:${details.globalPosition}  '
                'x轴:${details.globalPosition.dx}   y轴坐标: ${details.globalPosition.dy}');
          },
          onPanUpdate: (DragUpdateDetails details){
            print(''
                'onPanStart  点击处的坐标为:${details.globalPosition}  '
                'x轴:${details.globalPosition.dx}   y轴坐标: ${details.globalPosition.dy}');
          },
          onPanEnd: (DragEndDetails details){
            print('onPanEnd  点击处的坐标为:${details.primaryVelocity.toString()}');
          },
          onPanCancel: (){
            print('onPanCancel');
          },
          /*********************** Pan事件 *****************************/
        onScaleStart: (ScaleStartDetails details){},
        onScaleUpdate: (ScaleUpdateDetails details){},
        ),

运行效果:
Flutter | 手势操作可能遇到的一些问题及其解决_第2张图片

注意这句话:
Flutter | 手势操作可能遇到的一些问题及其解决_第3张图片


垂直和水平事件不能同时使用

需要做处理、判断、区分,
否则会同时触发 垂直和水平 两种事件;


双击事件要获取点击坐标,需要Pan(Tap)事件

  • 因为onDoubleTap()【双击手势回调】获取不了坐标,
    需要借助onTapDown()onTapUp()Details才行:

    Flutter | 手势操作可能遇到的一些问题及其解决_第4张图片









参考自CSDN的Flutter入门课程

你可能感兴趣的:(Flutter | 手势操作可能遇到的一些问题及其解决)