Skip to content

Commit 29b5307

Browse files
ckkenckken
committed
Merge branch 'dev' of https://github.com/efoxTeam/flutter-ui into dev
2 parents 03dfa24 + 4b5a9e9 commit 29b5307

File tree

8 files changed

+212
-140
lines changed

8 files changed

+212
-140
lines changed

‎docs/widget/gestures/gesturedetector/index.md

Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,20 +45,36 @@ GestureDetector({
4545
```
4646

4747
### 属性介绍
48-
#### 点击事件可以Tap属性,执行顺序如下罗列
48+
> 点击事件可用Tap属性,执行顺序如下罗列
4949
- onTapDown: 触摸时触发
5050
- onTapUp: 触摸离开时触发
5151
- onTap: 点击后触发
5252
- onTapCancel: 触发时取消
5353
- onDoubleTap: 200毫秒内触摸时触发，但不触发onTap
54-
#### 拖动事件可用Pan属性,执行顺序如下罗列,拖动时返回是手势位移数据
54+
> 拖动事件可用Pan属性,执行顺序如下罗列,拖动时返回是手势位移数据
5555
- onPanDown:
5656
- onPanStart: (DragStartDetails e) {} 返回相对屏幕位置
5757
- onPanUpdate: (DragUpdateDetails e) {} 回调函数中返回是手势位移数据
5858
- onPanEnd: (DragEndDetails e) {} 回调函数中返回Velocity，手势瞬时速度，可结合动画使用
5959
- onPanCancel: 回调取消
60-
#### 以下也可执行拖动事件，使用后不会触发Tap/Pan事件,执行顺序如下罗列，拖动时返回相对整个屏幕距离数据
60+
> 以下也可执行拖动事件，使用后不会触发Tap/Pan事件,执行顺序如下罗列，拖动时返回相对整个屏幕距离数据
6161
- onForcePressStart: (ForcePressDetails e) {}
6262
- onForcePressPeak: (ForcePressDetails e) {}
6363
- onForcePressUpdate: (ForcePressDetails e) {}
6464
- onForcePressEnd: (ForcePressDetails e) {}
65+
> 监听垂直或水平方向
66+
- onVerticalDragDown
67+
- onVerticalDragStart
68+
- onVerticalDragUpdate
69+
- onVerticalDragEnd
70+
- onVerticalDragCancel
71+
- onHorizontalDragDown
72+
- onHorizontalDragStart
73+
- onHorizontalDragUpdate
74+
- onHorizontalDragEnd
75+
- onHorizontalDragCancel
76+
> 手势放大
77+
- onScaleStart
78+
- onScaleUpdate
79+
- onScaleEnd
80+

‎lib/components/webviewComp.dart

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import 'package:flutter/material.dart';
2-
import 'headerComp.dart' as Header;
32
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart'
43
show FlutterWebviewPlugin, WebviewScaffold;
54

‎lib/widget/gestures/gesturedetector/demo.dart

Lines changed: 84 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import 'package:flutter/material.dart';
2-
import 'package:random_pk/random_pk.dart' show RandomContainer;
3-
42
class Index extends StatefulWidget {
53
@override
64
State<StatefulWidget> createState() => _IndexState();
@@ -32,106 +30,98 @@ class _IndexState extends State<Index> {
3230
return Scaffold(
3331
appBar: AppBar(
3432
title: Text('GestureDetector'),
33+
automaticallyImplyLeading: false,
3534
),
3635
body: Center(
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-
),
49-
),
50-
Divider(
51-
height: 20,
36+
child: Column(
37+
children: <Widget>[
38+
GestureDetector(
39+
onTap: () {
40+
Scaffold.of(context).showSnackBar(
41+
SnackBar(content: Text('you click the button')));
42+
},
43+
child: Icon(
44+
Icons.share,
45+
color: Colors.red,
5246
),
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-
],
47+
),
48+
Divider(
49+
height: 20,
50+
),
51+
GestureDetector(
52+
onDoubleTap: () {
53+
updateText('onDoubleTap');
54+
},
55+
onTapDown: (TapDownDetails e) {
56+
updateText('onTapDown');
57+
print(e.globalPosition);
58+
},
59+
onTapCancel: () {
60+
updateText('onTapCancel');
61+
},
62+
// 连接点击两次的话，不会触发onTap，只会触发 onDoubleTap
63+
onTap: () {
64+
updateText('onTap');
65+
setState(() {
66+
isOn = !isOn;
67+
});
68+
},
69+
child: Container(
70+
margin: EdgeInsets.all(10),
71+
color: Colors.red,
72+
child: ListTile(
73+
leading: Icon(
74+
Icons.lightbulb_outline,
75+
color: isOn ? Colors.yellow : Colors.grey,
8676
),
77+
title: Text("Click Here To Change Light"),
8778
),
8879
),
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-
),
80+
),
81+
Text('Event: $_value'),
82+
Text('Try to Double Click'),
83+
Divider(
84+
height: 40,
85+
),
86+
Text("使用ForcePress相关属性将不会触发Tap属性"),
87+
GestureDetector(
88+
onForcePressEnd: (ev) {
89+
updateText2('onForcePressEnd ${ev.globalPosition}');
90+
},
91+
onForcePressStart: (ev) {
92+
updateText2('onForcePressStart ${ev.globalPosition}');
93+
},
94+
onForcePressUpdate: (ev) {
95+
updateText2('onForcePressUpdate ${ev.globalPosition}');
96+
},
97+
onForcePressPeak: (ev) {
98+
updateText2('onForcePressPeak ${ev.globalPosition}');
99+
},
100+
// 连接点击两次的话，不会触发onTap，只会触发 onDoubleTap
101+
onTap: () {
102+
updateText2('onTap');
103+
setState(() {
104+
isOn = !isOn;
105+
});
106+
},
107+
child: Container(
108+
margin: EdgeInsets.all(10),
109+
alignment: Alignment.center,
110+
height: 50,
111+
color: Colors.red,
112+
child: Column(
113+
mainAxisAlignment: MainAxisAlignment.center,
114+
children: <Widget>[
115+
Text('Tap or Double Tap is not useful'),
116+
],
130117
),
131118
),
132-
Text(_value2),
133-
],
134-
),
119+
),
120+
Text(_value2),
121+
Divider(
122+
height: 20,
123+
),
124+
],
135125
),
136126
),
137127
);

‎lib/widget/gestures/gesturedetector/demo_force_press.dart

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ class _IndexState extends State<Index> {
3636
),
3737
body: Center(
3838
child: Column(
39+
mainAxisAlignment: MainAxisAlignment.center,
3940
children: <Widget>[
4041
Text("使用ForcePress相关属性将不会触发Tap属性"),
4142
GestureDetector(
@@ -63,14 +64,21 @@ class _IndexState extends State<Index> {
6364
),
6465
),
6566
),
67+
Divider(
68+
height: 10,
69+
),
6670
Text(_value1),
6771
Divider(
6872
height: 20,
6973
),
70-
Text("也可以监听水平或垂直滚动, 以下是水平滚动，垂直不变化为0"),
74+
Text("监听水平或垂直滚动"),
75+
Text('以下是水平滚动，垂直不变化为0'),
76+
Divider(
77+
height: 20,
78+
),
7179
SizedBox(
7280
height: 100,
73-
width: 100,
81+
width: 200,
7482
child: GestureDetector(
7583
onHorizontalDragDown: (DragDownDetails e) {
7684
updateText2('onHorizontalDragDown $e ${e.globalPosition}');

‎lib/widget/gestures/gesturedetector/demo_pan.dart

Lines changed: 40 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -27,43 +27,47 @@ class _IndexState extends State<Index> {
2727
@override
2828
Widget build(BuildContext context) {
2929
return Scaffold(
30-
appBar: AppBar(
31-
title: Text('GestureDetectorDrag'),
32-
),
33-
body: Center(
34-
child: Stack(
35-
children: <Widget>[
36-
Positioned(
37-
width:40,
38-
height: 40,
39-
top: _top,
40-
left: _left,
41-
child: GestureDetector(
42-
child: CircleAvatar(
43-
child: Text("Drag"),
30+
appBar: AppBar(
31+
title: Text('GestureDetectorDrag'),
32+
automaticallyImplyLeading: false,
33+
),
34+
body: ConstrainedBox(
35+
// 占位撑开全屏
36+
constraints: BoxConstraints.expand(),
37+
child: Stack(
38+
alignment: Alignment.center,
39+
children: <Widget>[
40+
Text('Top: $_top, Left: $_left'),
41+
Positioned(
42+
width: 80,
43+
height: 80,
44+
top: _top,
45+
left: _left,
46+
child: GestureDetector(
47+
child: CircleAvatar(
48+
child: Text("Drag"),
49+
),
50+
onPanStart: (DragStartDetails ev) {
51+
print('onPanStart $ev');
52+
},
53+
// DragEndDetails结束时用户滑动的瞬间速度
54+
onPanEnd: (DragEndDetails ev) {
55+
print('end $ev');
56+
},
57+
onPanCancel: () {
58+
setPanEvent('onPanCancel');
59+
},
60+
// DragDownDetails返回相对屏幕的位置
61+
onPanDown: (DragDownDetails ev) {
62+
print('DragDownDetails ${ev.globalPosition}');
63+
},
64+
onPanUpdate: (DragUpdateDetails ev) {
65+
setPanEvent('onPanUpdate', ev);
66+
},
4467
),
45-
onPanStart: (DragStartDetails ev) {
46-
print('onPanStart $ev');
47-
},
48-
// DragEndDetails结束时用户滑动的瞬间速度
49-
onPanEnd: (DragEndDetails ev) {
50-
print('end $ev');
51-
},
52-
onPanCancel: () {
53-
setPanEvent('onPanCancel');
54-
},
55-
// DragDownDetails返回相对屏幕的位置
56-
onPanDown: (DragDownDetails ev) {
57-
print('DragDownDetails ${ev.globalPosition}');
58-
},
59-
onPanUpdate: (DragUpdateDetails ev) {
60-
setPanEvent('onPanUpdate', ev);
61-
},
6268
),
63-
),
64-
],
65-
),
66-
),
67-
);
69+
],
70+
),
71+
));
6872
}
6973
}

0 commit comments

Comments
 (0)