Skip to content

Commit a66273a

Browse files
CaiJingLongCaiJingLong
authored
Merge pull request #42 from OpenFlutter/animation-config
Support animation of show/hide toast.
2 parents 60e5880 + 508b3a5 commit a66273a

15 files changed

+309
-125
lines changed

‎CHANGELOG.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# Change log
22

3+
## 2.3.0
4+
5+
New feature:
6+
7+
- Add animation for show/hide the oktoast.
8+
39
## 2.2.1
410

511
Fix:

‎README.md‎

Lines changed: 62 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ latest version: [![pub package](https://img.shields.io/pub/v/oktoast.svg)](https
4141

4242
```yaml
4343
dependencies:
44-
oktoast: ^2.2.1 # such as version, you need use the latest version of pub.
44+
oktoast: ^2.3.0 # such as version, you need use the latest version of pub.
4545
```
4646
4747
### 2. Import library in dart file
@@ -82,59 +82,70 @@ There are two reasons why you need to wrap MaterialApp
8282

8383
oktoast have default style, and you also can custom style or other behavior.
8484

85-
| name | type | need | desc |
86-
| :------------------: | :----------------: | :------: | :-----------------------------------------------------------: |
87-
| child | Widget | required | Usually Material App |
88-
| textStyle | TextStyle | optional | |
89-
| radius | double | optional | |
90-
| backgroundColor | Color | optional | backroundColor |
91-
| position | ToastPosition | optional | |
92-
| dismissOtherOnShow | bool | optional | If true, other toasts will be dismissed. Default false. |
93-
| movingOnWindowChange | bool | optional | If true, when the size changes, toast is moved. Default true. |
94-
| textDirection | TextDirection | optional | |
95-
| textPadding | EdgeInsetsGeometry | optional | Outer margin of text |
96-
| textAlign | TextAlign | optional | When the text wraps, the align of the text. |
97-
| handleTouch | bool | optional | Default is false, if it's true, can responed use touch event. |
85+
| name | type | need | desc |
86+
| :------------------: | :---------------------: | :------: | :-----------------------------------------------------------: |
87+
| child | Widget | required | Usually Material App |
88+
| textStyle | TextStyle | optional | |
89+
| radius | double | optional | |
90+
| backgroundColor | Color | optional | backroundColor |
91+
| position | ToastPosition | optional | |
92+
| dismissOtherOnShow | bool | optional | If true, other toasts will be dismissed. Default false. |
93+
| movingOnWindowChange | bool | optional | If true, when the size changes, toast is moved. Default true. |
94+
| textDirection | TextDirection | optional | |
95+
| textPadding | EdgeInsetsGeometry | optional | Outer margin of text |
96+
| textAlign | TextAlign | optional | When the text wraps, the align of the text. |
97+
| handleTouch | bool | optional | Default is false, if it's true, can responed use touch event. |
98+
| animationBuilder | OKToastAnimationBuilder | optional | Add animation to show / hide toast. |
99+
| animationDuration | Duration | optional | The duration of animation. |
100+
| animationCurve | Curve | optional | Curve of animation. |
98101

99102
### Method `showToast`
100103

101-
Display text on toast
102-
103-
| name | type | need | desc |
104-
| :---------------: | :----------------: | :------: | :--: |
105-
| msg | String | required | |
106-
| context | BuildContext | optional | |
107-
| duration | Duration | optional | |
108-
| position | ToastPosition | optional | |
109-
| textStyle | TextStyle | optional | |
110-
| textPadding | EdgeInsetsGeometry | optional | |
111-
| backgroundColor | Color | optional | |
112-
| radius | double | optional | |
113-
| onDismiss | Function | optional | |
114-
| textDirection | TextDirection | optional | |
115-
| dismissOtherToast | bool | optional | |
116-
| textAlign | TextAlign | optional | |
104+
Display text on toast.
105+
106+
Description of params see `OKToast`.
107+
108+
| name | type | need | desc |
109+
| :---------------: | :---------------------: | :------: | :------------: |
110+
| msg | String | required | Text of toast. |
111+
| context | BuildContext | optional | |
112+
| duration | Duration | optional | |
113+
| position | ToastPosition | optional | |
114+
| textStyle | TextStyle | optional | |
115+
| textPadding | EdgeInsetsGeometry | optional | |
116+
| backgroundColor | Color | optional | |
117+
| radius | double | optional | |
118+
| onDismiss | Function | optional | |
119+
| textDirection | TextDirection | optional | |
120+
| dismissOtherToast | bool | optional | |
121+
| textAlign | TextAlign | optional | |
122+
| animationBuilder | OKToastAnimationBuilder | optional | |
123+
| animationDuration | Duration | optional | |
124+
| animationCurve | Curve | optional | |
117125

118126
### Method `showToastWidget`
119127

120128
Display custom widgets on toast
121129

122-
param see showToast
123-
124-
| name | type | need | desc |
125-
| :---------------: | :-----------: | :------: | :-----------------------------------------------------------: |
126-
| widget | Widget | required | The widget you want to display. |
127-
| context | BuildContext | optional | |
128-
| duration | Duration | optional | |
129-
| position | ToastPosition | optional | |
130-
| onDismiss | Function | optional | |
131-
| dismissOtherToast | bool | optional | |
132-
| textDirection | TextDirection | optional | |
133-
| handleTouch | bool | optional | Default is false, if it's true, can responed use touch event. |
130+
Description of params see `showToast`.
131+
132+
| name | type | need | desc |
133+
| :---------------: | :---------------------: | :------: | :-----------------------------: |
134+
| widget | Widget | required | The widget you want to display. |
135+
| context | BuildContext | optional | |
136+
| duration | Duration | optional | |
137+
| position | ToastPosition | optional | |
138+
| onDismiss | Function | optional | |
139+
| dismissOtherToast | bool | optional | |
140+
| textDirection | TextDirection | optional | |
141+
| handleTouch | bool | optional | |
142+
| animationBuilder | OKToastAnimationBuilder | optional | |
143+
| animationDuration | Duration | optional | |
144+
| animationCurve | Curve | optional | |
134145

135146
### Method `dismissAllToast`
136147

137-
dismiss all toast
148+
Dismiss all toast.
138149

139150
### Return value of `showToast` and `showToastWidget`
140151

@@ -284,3 +295,11 @@ class _MyHomePageState extends State<MyHomePage> {
284295
285296
286297
```
298+
299+
## CHANGELOG
300+
301+
[Link](https://github.com/OpenFlutter/flutter_oktoast/blob/master/CHANGELOG.md)
302+
303+
## LICENSE
304+
305+
[Apache-2.0](https://github.com/OpenFlutter/flutter_oktoast/blob/master/LICENSE)

‎example/lib/main.dart‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@ class MyApp extends StatelessWidget {
2020
),
2121
home: MyHomePage(),
2222
),
23+
animationCurve: Curves.easeIn,
24+
animationBuilder: Miui10AnimBuilder(),
25+
animationDuration: Duration(milliseconds: 200),
2326
);
2427
}
2528
}
@@ -49,6 +52,7 @@ class _MyHomePageState extends State<MyHomePage> {
4952
backgroundColor: Colors.black.withOpacity(0.8),
5053
radius: 13.0,
5154
textStyle: TextStyle(fontSize: 18.0),
55+
animationBuilder: Miui10AnimBuilder(),
5256
);
5357

5458
showToast(

‎example/pubspec.lock‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ packages:
6666
path: ".."
6767
relative: true
6868
source: path
69-
version: "2.2.1"
69+
version: "2.3.0"
7070
path:
7171
dependency: transitive
7272
description:

‎lib/oktoast.dart‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,7 @@ export 'src/core/toast.dart'
44
show showToast, showToastWidget, OKToast, ToastFuture, dismissAllToast;
55

66
export 'src/core/position.dart';
7+
export 'src/widget/animation/animation_builder.dart';
8+
export 'src/widget/animation/opacity_builder.dart';
9+
export 'src/widget/animation/offset_builder.dart';
10+
export 'src/widget/animation/miui10_anim.dart';

‎lib/src/core/toast.dart‎

Lines changed: 33 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -5,23 +5,24 @@ import 'dart:collection';
55
import 'dart:ui' as ui;
66

77
import 'package:flutter/material.dart';
8-
import 'package:flutter/cupertino.dart';
8+
import 'package:oktoast/oktoast.dart';
99

1010
import 'position.dart';
1111
import 'toast_manager.dart';
1212

1313
part 'toast_future.dart';
14+
1415
part '../widget/theme.dart';
16+
1517
part '../widget/oktoast.dart';
18+
1619
part '../widget/container.dart';
1720

1821
LinkedHashMap<_OKToastState, BuildContext> _contextMap = LinkedHashMap();
1922
const _defaultDuration = Duration(
2023
milliseconds: 2300,
2124
);
2225

23-
const _opacityDuration = Duration(milliseconds: 250);
24-
2526
/// show toast with [msg],
2627
ToastFuture showToast(
2728
String msg, {
@@ -36,6 +37,9 @@ ToastFuture showToast(
3637
TextDirection textDirection,
3738
bool dismissOtherToast,
3839
TextAlign textAlign,
40+
OKToastAnimationBuilder animationBuilder,
41+
Duration animationDuration,
42+
Curve animationCurve,
3943
}) {
4044
context ??= _contextMap.values.first;
4145

@@ -69,12 +73,14 @@ ToastFuture showToast(
6973

7074
return showToastWidget(
7175
widget,
76+
animationBuilder: animationBuilder,
7277
context: context,
7378
duration: duration,
7479
onDismiss: onDismiss,
7580
position: position,
7681
dismissOtherToast: dismissOtherToast,
7782
textDirection: textDirection,
83+
animationCurve: animationCurve,
7884
);
7985
}
8086

@@ -88,20 +94,25 @@ ToastFuture showToastWidget(
8894
bool dismissOtherToast,
8995
TextDirection textDirection,
9096
bool handleTouch,
97+
OKToastAnimationBuilder animationBuilder,
98+
Duration animationDuration,
99+
Curve animationCurve,
91100
}) {
92101
context ??= _contextMap.values.first;
93102
OverlayEntry entry;
94103
ToastFuture future;
95-
position ??= _ToastTheme.of(context).position;
104+
final theme = _ToastTheme.of(context);
96105

97-
handleTouch ??= _ToastTheme.of(context).handleTouch;
106+
position ??= theme.position;
107+
handleTouch ??= theme.handleTouch;
108+
animationBuilder ??= theme.animationBuilder;
109+
animationDuration ??=
110+
theme.animationDuration ?? const Duration(milliseconds: 250);
111+
animationCurve ??= theme.animationCurve ?? Curves.easeIn;
98112

99-
var movingOnWindowChange =
100-
_ToastTheme.of(context)?.movingOnWindowChange ?? false;
113+
final movingOnWindowChange = theme?.movingOnWindowChange ?? false;
101114

102-
var direction = textDirection ??
103-
_ToastTheme.of(context).textDirection ??
104-
TextDirection.ltr;
115+
final direction = textDirection ?? theme.textDirection ?? TextDirection.ltr;
105116

106117
GlobalKey<__ToastContainerState> key = GlobalKey();
107118

@@ -113,26 +124,29 @@ ToastFuture showToastWidget(
113124
entry = OverlayEntry(builder: (ctx) {
114125
return IgnorePointer(
115126
ignoring: !handleTouch,
116-
child: _ToastContainer(
117-
duration: duration,
118-
position: position,
119-
movingOnWindowChange: movingOnWindowChange,
120-
key: key,
121-
child: Directionality(
122-
textDirection: direction,
127+
child: Directionality(
128+
textDirection: direction,
129+
child: _ToastContainer(
130+
duration: duration,
131+
position: position,
132+
movingOnWindowChange: movingOnWindowChange,
133+
key: key,
123134
child: widget,
135+
animationBuilder: animationBuilder,
136+
animationDuration: animationDuration,
137+
animationCurve: animationCurve,
124138
),
125139
),
126140
);
127141
});
128142

129-
dismissOtherToast ??= _ToastTheme.of(context).dismissOtherOnShow ?? false;
143+
dismissOtherToast ??= theme.dismissOtherOnShow ?? false;
130144

131145
if (dismissOtherToast == true) {
132146
ToastManager().dismissAll();
133147
}
134148

135-
future = ToastFuture._(entry, onDismiss, key);
149+
future = ToastFuture._(entry, onDismiss, key, animationDuration);
136150

137151
Future.delayed(duration, () {
138152
future.dismiss();

‎lib/src/core/toast_future.dart‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,13 @@ class ToastFuture {
66
final VoidCallback _onDismiss;
77
bool _isShow = true;
88
final GlobalKey<__ToastContainerState> _containerKey;
9+
final Duration animationDuration;
910

1011
ToastFuture._(
1112
this._entry,
1213
this._onDismiss,
1314
this._containerKey,
15+
this.animationDuration,
1416
);
1517

1618
void dismiss({bool showAnim = false}) {
@@ -23,7 +25,7 @@ class ToastFuture {
2325

2426
if (showAnim) {
2527
_containerKey.currentState.showDismissAnim();
26-
Future.delayed(_opacityDuration, () {
28+
Future.delayed(animationDuration, () {
2729
_entry.remove();
2830
});
2931
} else {

‎lib/src/widget/animation/animation_builder.dart‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import 'package:flutter/widgets.dart';
2+
3+
typedef Widget OKToastAnimationBuilder(
4+
BuildContext context,
5+
Widget child,
6+
AnimationController controller,
7+
double percent,
8+
);
9+
10+
abstract class BaseAnimationBuilder {
11+
BaseAnimationBuilder();
12+
13+
Widget call(
14+
BuildContext context,
15+
Widget child,
16+
AnimationController controller,
17+
double percent,
18+
) {
19+
return buildWidget(context, child, controller, percent);
20+
}
21+
22+
Widget buildWidget(BuildContext context, Widget child,
23+
AnimationController controller, double percent);
24+
}

‎lib/src/widget/animation/miui10_anim.dart‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import 'package:flutter/material.dart';
2+
import 'dart:math' show min;
3+
import 'animation_builder.dart';
4+
5+
class Miui10AnimBuilder extends BaseAnimationBuilder {
6+
@override
7+
Widget buildWidget(
8+
BuildContext context,
9+
Widget child,
10+
AnimationController controller,
11+
double percent,
12+
) {
13+
final opacity = min(1.0, percent + 0.2);
14+
final offset = (1 - percent) * 20;
15+
16+
return Opacity(
17+
opacity: opacity,
18+
child: Transform.translate(
19+
child: child,
20+
offset: Offset(0, offset),
21+
),
22+
);
23+
}
24+
}

0 commit comments

Comments
 (0)