Flutter手势处理
在Flutter中的手势事件分为两层。
第一层有原始指针事件,它描述了屏幕上指针(例如,触摸,鼠标和触控笔)的位置和移动。
第二层有手势,描述由一个或多个指针移动组成的语义动作。
在flutter中简单的手势处理用封装好的GestureDetector来处理就好了。
GestureDetector中为我们提供的方法有:
onTapDown:按下
onTap:点击动作
onTapUp:抬起
onTapCancel:触发了 onTapDown,但并没有完成一个 onTap 动作
onDoubleTap:双击
onLongPress:长按
onScaleStart, onScaleUpdate, onScaleEnd:缩放
onVerticalDragDown, onVerticalDragStart, onVerticalDragUpdate, onVerticalDragEnd, onVerticalDragCancel, onVerticalDragUpdate:在竖直方向上移动
onHorizontalDragDown, onHorizontalDragStart, onHorizontalDragUpdate, onHorizontalDragEnd, onHorizontalDragCancel, onHorizontalDragUpdate:在水平方向上移动
onPanDown, onPanStart, onPanUpdate, onPanEnd, onPanCancel:拖曳(触碰到屏幕、在屏幕上移动)
以onTap、onDoubleTap、onLongPress为例rt:
image
附上代码:
//注意,这里的 Fluttertoast 需要导包
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: GestureDetector(
onTap: (){
Fluttertoast.showToast(msg: "你点击了一次",
toastLength: Toast.LENGTH_SHORT);
},
onDoubleTap: (){
Fluttertoast.showToast(msg: "你双击了一次",
toastLength: Toast.LENGTH_SHORT);
},
onLongPress: (){
Fluttertoast.showToast(msg: "你长按了一次",
toastLength: Toast.LENGTH_SHORT);
},
child: Container(
child: Image.asset("images/nyy.png"),
),
),
);
}
导包:
dev_dependencies:
fluttertoast: ^3.1.1
大功告成!其他的方法读者可自行尝试。