Skip to content

Commit e7d6bb4

Browse files
committed
Merge branch 'dev' of https://github.com/efoxTeam/flutter-ui into dev
2 parents edf22b8 + 7a8cf01 commit e7d6bb4

File tree

9 files changed

+368
-108
lines changed

9 files changed

+368
-108
lines changed

android/app/src/main/AndroidManifest.xml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
22
package="com.flutter.beer"
3+
android:versionCode="1"
4+
android:versionName="1.0"
35
android:installLocation="preferExternal">
46

57
<!-- The INTERNET permission is required for development. Specifically,
Lines changed: 64 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,64 @@
1-
## **文档完善中**
1+
## **GestureDetector**
2+
> 该组件可监听触摸事件,可包裹需要监听的组件后使用带有的触摸事件。
3+
4+
### 构造函数
5+
```
6+
GestureDetector({
7+
Key key,
8+
this.child,
9+
this.onTapDown,
10+
this.onTapUp,
11+
this.onTap,
12+
this.onTapCancel,
13+
this.onDoubleTap,
14+
this.onLongPress,
15+
this.onLongPressUp,
16+
this.onLongPressDragStart,
17+
this.onLongPressDragUpdate,
18+
this.onLongPressDragUp,
19+
this.onVerticalDragDown,
20+
this.onVerticalDragStart,
21+
this.onVerticalDragUpdate,
22+
this.onVerticalDragEnd,
23+
this.onVerticalDragCancel,
24+
this.onHorizontalDragDown,
25+
this.onHorizontalDragStart,
26+
this.onHorizontalDragUpdate,
27+
this.onHorizontalDragEnd,
28+
this.onHorizontalDragCancel,
29+
this.onForcePressStart,
30+
this.onForcePressPeak,
31+
this.onForcePressUpdate,
32+
this.onForcePressEnd,
33+
this.onPanDown,
34+
this.onPanStart,
35+
this.onPanUpdate,
36+
this.onPanEnd,
37+
this.onPanCancel,
38+
this.onScaleStart,
39+
this.onScaleUpdate,
40+
this.onScaleEnd,
41+
this.behavior,
42+
this.excludeFromSemantics = false,
43+
this.dragStartBehavior = DragStartBehavior.down,
44+
})
45+
```
46+
47+
### 属性介绍
48+
#### 点击事件可以Tap属性,执行顺序如下罗列
49+
- onTapDown: 触摸时触发
50+
- onTapUp: 触摸离开时触发
51+
- onTap: 点击后触发
52+
- onTapCancel: 触发时取消
53+
- onDoubleTap: 200毫秒内触摸时触发,但不触发onTap
54+
#### 拖动事件可用Pan属性,执行顺序如下罗列,拖动时返回是手势位移数据
55+
- onPanDown:
56+
- onPanStart: (DragStartDetails e) {} 返回相对屏幕位置
57+
- onPanUpdate: (DragUpdateDetails e) {} 回调函数中返回是手势位移数据
58+
- onPanEnd: (DragEndDetails e) {} 回调函数中返回Velocity,手势瞬时速度,可结合动画使用
59+
- onPanCancel: 回调取消
60+
#### 以下也可执行拖动事件,使用后不会触发Tap/Pan事件,执行顺序如下罗列,拖动时返回相对整个屏幕距离数据
61+
- onForcePressStart: (ForcePressDetails e) {}
62+
- onForcePressPeak: (ForcePressDetails e) {}
63+
- onForcePressUpdate: (ForcePressDetails e) {}
64+
- onForcePressEnd: (ForcePressDetails e) {}

lib/components/exampleComp.dart

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,18 +12,18 @@ class Index extends StatelessWidget {
1212
@override
1313
Widget build(BuildContext context) {
1414
Size size = MediaQuery.of(context).size;
15-
double _dp = 1.5;
1615
return Store.connect(
1716
builder: (context, child, MainStateModel model) {
1817
return Center(
1918
child: Container(
20-
width: size.width,
21-
height: size.height / _dp,
22-
margin: EdgeInsets.all(30 / _dp),
19+
margin: EdgeInsets.all(10),
2320
decoration: BoxDecoration(
2421
border: Border.all(color: Color(AppTheme.mainColor), width: 1.0),
2522
),
26-
child: this.child,
23+
child: SizedBox.fromSize(
24+
size: size / 1.3,
25+
child: this.child,
26+
),
2727
),
2828
);
2929
},

lib/widget/gestures/gesturedetector/demo.dart

Lines changed: 94 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import 'package:flutter/material.dart';
2+
import 'package:random_pk/random_pk.dart' show RandomContainer;
23

34
class Index extends StatefulWidget {
45
@override
@@ -26,114 +27,111 @@ class _IndexState extends State<Index> {
2627
});
2728
}
2829

29-
3030
@override
3131
Widget build(BuildContext context) {
3232
return Scaffold(
3333
appBar: AppBar(
3434
title: Text('GestureDetector'),
3535
),
3636
body: Center(
37-
child: Column(
38-
children: <Widget>[
39-
GestureDetector(
40-
onTap: () {
41-
Scaffold.of(context).showSnackBar(
42-
SnackBar(content: Text('you click the button')));
43-
},
44-
child: Icon(
45-
Icons.share,
46-
color: Colors.red,
37+
child: RandomContainer(
38+
child: Column(
39+
children: <Widget>[
40+
GestureDetector(
41+
onTap: () {
42+
Scaffold.of(context).showSnackBar(
43+
SnackBar(content: Text('you click the button')));
44+
},
45+
child: Icon(
46+
Icons.share,
47+
color: Colors.red,
48+
),
4749
),
48-
),
49-
GestureDetector(
50-
onPanStart: (ev) {
51-
updateText('onPanStart $ev');
52-
},
53-
onPanEnd: (ev) {
54-
updateText('onPanEnd $ev');
55-
},
56-
onPanCancel: () {
57-
updateText('onPanCancel');
58-
},
59-
onPanDown: (ev) {
60-
updateText('onPanDown $ev');
61-
},
62-
onPanUpdate: (ev) {
63-
updateText('onPanUpdate $ev');
64-
},
65-
onDoubleTap: () {
66-
updateText('onDoubleTap');
67-
},
68-
// 连接点击两次的话,不会触发onTap,只会触发 onDoubleTap
69-
onTap: () {
70-
updateText('onTap');
71-
setState(() {
72-
isOn = !isOn;
73-
});
74-
},
75-
child: Container(
76-
alignment: Alignment.center,
77-
height: 100,
78-
width: 200,
79-
color: Colors.blue,
80-
child: Column(
81-
mainAxisAlignment: MainAxisAlignment.center,
82-
children: <Widget>[
83-
Text('TURN LIGHTS ON'),
84-
Divider(),
85-
Icon(
86-
Icons.lightbulb_outline,
87-
color: isOn ? Colors.yellow : Colors.grey,
88-
)
89-
],
50+
Divider(
51+
height: 20,
52+
),
53+
GestureDetector(
54+
onDoubleTap: () {
55+
updateText('onDoubleTap');
56+
},
57+
onTapDown: (TapDownDetails e) {
58+
updateText('onTapDown');
59+
print(e.globalPosition);
60+
},
61+
onTapCancel: () {
62+
updateText('onTapCancel');
63+
},
64+
// 连接点击两次的话,不会触发onTap,只会触发 onDoubleTap
65+
onTap: () {
66+
updateText('onTap');
67+
setState(() {
68+
isOn = !isOn;
69+
});
70+
},
71+
child: Container(
72+
alignment: Alignment.center,
73+
height: 100,
74+
width: 200,
75+
color: Colors.blue,
76+
child: Column(
77+
mainAxisAlignment: MainAxisAlignment.center,
78+
children: <Widget>[
79+
Text('TURN LIGHTS ON'),
80+
Divider(),
81+
Icon(
82+
Icons.lightbulb_outline,
83+
color: isOn ? Colors.yellow : Colors.grey,
84+
)
85+
],
86+
),
9087
),
9188
),
92-
),
93-
Text(_value),
94-
GestureDetector(
95-
onLongPress: () {
96-
updateText2('onLongPress');
97-
},
98-
onForcePressEnd: (ev) {
99-
updateText2('onForcePressEnd ${ev.globalPosition}');
100-
},
101-
onForcePressStart: (ev) {
102-
updateText2('onForcePressStart ${ev.globalPosition}');
103-
},
104-
onForcePressUpdate: (ev) {
105-
updateText2('onForcePressUpdate ${ev.globalPosition}');
106-
},
107-
onForcePressPeak: (ev) {
108-
updateText2('onForcePressPeak ${ev.globalPosition}');
109-
},
110-
// 连接点击两次的话,不会触发onTap,只会触发 onDoubleTap
111-
onTap: () {
112-
updateText2('onDoubleTap');
113-
setState(() {
114-
isOn = !isOn;
115-
});
116-
},
117-
child: Container(
118-
alignment: Alignment.center,
119-
height: 100,
120-
width: 200,
121-
color: Colors.blue,
122-
child: Column(
123-
mainAxisAlignment: MainAxisAlignment.center,
124-
children: <Widget>[
125-
Text('Tap or DoubleTap is not useful'),
126-
Divider(),
127-
Icon(
128-
Icons.lightbulb_outline,
129-
color: isOn ? Colors.yellow : Colors.grey,
130-
)
131-
],
89+
Text(_value),
90+
Divider(
91+
height: 20,
92+
),
93+
Text("使用ForcePress相关属性将不会触发Tap属性"),
94+
GestureDetector(
95+
onForcePressEnd: (ev) {
96+
updateText2('onForcePressEnd ${ev.globalPosition}');
97+
},
98+
onForcePressStart: (ev) {
99+
updateText2('onForcePressStart ${ev.globalPosition}');
100+
},
101+
onForcePressUpdate: (ev) {
102+
updateText2('onForcePressUpdate ${ev.globalPosition}');
103+
},
104+
onForcePressPeak: (ev) {
105+
updateText2('onForcePressPeak ${ev.globalPosition}');
106+
},
107+
// 连接点击两次的话,不会触发onTap,只会触发 onDoubleTap
108+
onTap: () {
109+
updateText2('onTap');
110+
setState(() {
111+
isOn = !isOn;
112+
});
113+
},
114+
child: Container(
115+
alignment: Alignment.center,
116+
height: 100,
117+
width: 200,
118+
color: Colors.blue,
119+
child: Column(
120+
mainAxisAlignment: MainAxisAlignment.center,
121+
children: <Widget>[
122+
Text('Tap or DoubleTap is not useful'),
123+
Divider(),
124+
Icon(
125+
Icons.lightbulb_outline,
126+
color: isOn ? Colors.yellow : Colors.grey,
127+
)
128+
],
129+
),
132130
),
133131
),
134-
),
135-
Text(_value2),
136-
],
132+
Text(_value2),
133+
],
134+
),
137135
),
138136
),
139137
);

0 commit comments

Comments
 (0)