1、添加手势识别的代码
2、
按下-->松开 会产生一个点击事件
3、
长按时，会产生一个 按下-->取消-->长按的事件
就是说长按的化会有一个取消的事件告诉我们
4、
取消事件：当按住控件，然后划出控件的范围时，会产生取消的事件，但是没有‘松开’和‘点击’的回调，这就代表了‘取消’的事件
5、画小球
按住小球进行拖动
此时小球就可以跟着手指的移动而进行移动了
6、
import 'package:flutter/material.dart'; import 'package:flutter_color_plugin/flutter_color_plugin.dart'; void main() => runApp(GesturePage()); //StatefulWidget与基础组件 class GesturePage extends StatefulWidget{ @override State<StatefulWidget> createState() => GesturePageState(); } class GesturePageState extends State<GesturePage>{ String printString=''; double moveX=0,moveY=0;//小球移动的位置 Future<Null> _handleRefresh()async{ await Future.delayed(Duration(milliseconds: 200)); return null; } _item(String title,Color color){ return Container( alignment: Alignment.center, decoration: BoxDecoration(color: color), child: Text(title,style: TextStyle(fontSize: 22,color:Colors.white)), ); } @override Widget build(BuildContext context) { TextStyle textStyle=TextStyle(fontSize: 20); return MaterialApp( title: '如何检测用户手势以及处理点击事件？', theme: ThemeData( primarySwatch: Colors.yellow, ), home: Scaffold( appBar: AppBar(title: Text('如何检测用户手势以及处理点击事件？'), leading:GestureDetector( onTap: (){ Navigator.pop(context); }, child: Icon(Icons.arrow_back), ) ), body:FractionallySizedBox( widthFactor: 1, child: Stack( children: <Widget>[ Column( children: <Widget>[ GestureDetector( onTap: ()=>_printMsg('点击'), onDoubleTap: ()=>_printMsg('双击'), onLongPress: ()=>_printMsg('长按'), onTapCancel: ()=>_printMsg('点击取消'), onTapUp: (e)=>_printMsg('松开'), onTapDown: (e)=>_printMsg('按下'), child: Container( padding: EdgeInsets.all(60), decoration: BoxDecoration(color:Colors.blueAccent), child: Text('点我',style: TextStyle(fontSize: 36,color:Colors.white)), ), ), Text(printString) ], ), Positioned( //跟着手指滑动的小球 left: moveX, top: moveY, child: GestureDetector( //手指滑动过程中，该方法会被回调 onPanUpdate: (e)=>_doMove(e), child: Container( width: 72, height: 72, decoration: BoxDecoration( color: Colors.amber, //直径是72，半径是36，这样就可以画出一个球形 borderRadius: BorderRadius.circular(36), ) ) ) ) ], ), ) ), ); } _printMsg(String msg) { setState(() { printString+=' ,$msg'; }); } _doMove(DragUpdateDetails e) { setState(() { moveX+=e.delta.dx; moveY+=e.delta.dy; }); print(e); } }
