-
Notifications
You must be signed in to change notification settings - Fork 0
/
zoom_page_route.dart
68 lines (63 loc) · 2.29 KB
/
zoom_page_route.dart
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
import 'package:flutter/material.dart';
class ZoomPageRoute<T> extends PageRouteBuilder<T> {
ZoomPageRoute({
Curve transitionCurve = Curves.linearToEaseOut,
Duration transitionDuration = const Duration(milliseconds: 500),
required WidgetBuilder builder,
}) : super(
transitionDuration: transitionDuration,
transitionsBuilder: createTranstionBuilder(transitionCurve),
pageBuilder: (context, _, __) {
return builder(context);
},
);
static RouteTransitionsBuilder createTranstionBuilder(Curve curve) {
return (context, animationIn, animationOut, child) {
final reverseCurve = curve.flipped;
final opacityAnimationIn = CurvedAnimation(
parent: animationIn,
curve: curve,
reverseCurve: reverseCurve,
);
final opacityAnimationOut = CurvedAnimation(
parent: animationOut.drive(Tween(begin: 1, end: 0)),
// Note: in practice, this curve is flipped because of how the
// value is used within the transition.
//
// If `curve: curve` is set, the page will lose opacity very
// slowly at the start and then drop off sharp near the end
// (essentially the same as `curve.flipped`,
// i.e., `reverseCurve`).
// If `curve: reverseCurve` is set, the animation will exhibit
// the behavior expected of `curve` (unflipped), and the
// opacity will start with a fast dropoff and then slowly
// settles.
curve: reverseCurve,
reverseCurve: curve,
);
final scaleAnimationIn = CurvedAnimation(
parent: animationIn,
curve: curve,
reverseCurve: reverseCurve,
).drive<double>(Tween(begin: 0.8, end: 1));
final scaleAnimationOut = CurvedAnimation(
parent: animationOut,
curve: curve,
reverseCurve: reverseCurve,
).drive<double>(Tween(begin: 1, end: 1.2));
return FadeTransition(
opacity: opacityAnimationIn,
child: FadeTransition(
opacity: opacityAnimationOut,
child: ScaleTransition(
scale: scaleAnimationIn,
child: ScaleTransition(
scale: scaleAnimationOut,
child: child,
),
),
),
);
};
}
}