@@ -32,33 +32,47 @@ class _HomeState extends State<Home> with TickerProviderStateMixin<Home> {
32
32
int selectedIndex = 0 ;
33
33
34
34
AnimationController buildFaderController () {
35
- final AnimationController controller =
36
- AnimationController (vsync: this , duration: const Duration (milliseconds: 200 ));
37
- controller.addStatusListener ((AnimationStatus status) {
38
- if (status == AnimationStatus .dismissed) {
39
- setState (() {}); // Rebuild unselected destinations offstage.
40
- }
41
- });
35
+ final AnimationController controller = AnimationController (
36
+ vsync: this ,
37
+ duration: const Duration (milliseconds: 300 ),
38
+ );
39
+ controller.addStatusListener (
40
+ (AnimationStatus status) {
41
+ if (status == AnimationStatus .dismissed) {
42
+ setState (() {}); // Rebuild unselected destinations offstage.
43
+ }
44
+ },
45
+ );
42
46
return controller;
43
47
}
44
48
45
49
@override
46
50
void initState () {
47
51
super .initState ();
48
- navigatorKeys =
49
- List <GlobalKey <NavigatorState >>.generate (allDestinations.length, (int index) => GlobalKey ()).toList ();
50
- destinationFaders =
51
- List <AnimationController >.generate (allDestinations.length, (int index) => buildFaderController ()).toList ();
52
+
53
+ navigatorKeys = List <GlobalKey <NavigatorState >>.generate (
54
+ allDestinations.length,
55
+ (int index) => GlobalKey (),
56
+ ).toList ();
57
+
58
+ destinationFaders = List <AnimationController >.generate (
59
+ allDestinations.length,
60
+ (int index) => buildFaderController (),
61
+ ).toList ();
52
62
destinationFaders[selectedIndex].value = 1.0 ;
53
- destinationViews = allDestinations.map ((Destination destination) {
54
- return FadeTransition (
55
- opacity: destinationFaders[destination.index].drive (CurveTween (curve: Curves .fastOutSlowIn)),
56
- child: DestinationView (
57
- destination: destination,
58
- navigatorKey: navigatorKeys[destination.index],
59
- ),
60
- );
61
- }).toList ();
63
+
64
+ final CurveTween tween = CurveTween (curve: Curves .fastOutSlowIn);
65
+ destinationViews = allDestinations.map <Widget >(
66
+ (Destination destination) {
67
+ return FadeTransition (
68
+ opacity: destinationFaders[destination.index].drive (tween),
69
+ child: DestinationView (
70
+ destination: destination,
71
+ navigatorKey: navigatorKeys[destination.index],
72
+ ),
73
+ );
74
+ },
75
+ ).toList ();
62
76
}
63
77
64
78
@override
@@ -81,20 +95,22 @@ class _HomeState extends State<Home> with TickerProviderStateMixin<Home> {
81
95
top: false ,
82
96
child: Stack (
83
97
fit: StackFit .expand,
84
- children: allDestinations.map ((Destination destination) {
85
- final int index = destination.index;
86
- final Widget view = destinationViews[index];
87
- if (index == selectedIndex) {
88
- destinationFaders[index].forward ();
89
- return Offstage (offstage: false , child: view);
90
- } else {
91
- destinationFaders[index].reverse ();
92
- if (destinationFaders[index].isAnimating) {
93
- return IgnorePointer (child: view);
98
+ children: allDestinations.map (
99
+ (Destination destination) {
100
+ final int index = destination.index;
101
+ final Widget view = destinationViews[index];
102
+ if (index == selectedIndex) {
103
+ destinationFaders[index].forward ();
104
+ return Offstage (offstage: false , child: view);
105
+ } else {
106
+ destinationFaders[index].reverse ();
107
+ if (destinationFaders[index].isAnimating) {
108
+ return IgnorePointer (child: view);
109
+ }
110
+ return Offstage (child: view);
94
111
}
95
- return Offstage (child: view);
96
- }
97
- }).toList (),
112
+ },
113
+ ).toList (),
98
114
),
99
115
),
100
116
bottomNavigationBar: NavigationBar (
@@ -104,12 +120,14 @@ class _HomeState extends State<Home> with TickerProviderStateMixin<Home> {
104
120
selectedIndex = index;
105
121
});
106
122
},
107
- destinations: allDestinations.map ((Destination destination) {
108
- return NavigationDestination (
109
- icon: Icon (destination.icon, color: destination.color),
110
- label: destination.title,
111
- );
112
- }).toList (),
123
+ destinations: allDestinations.map <NavigationDestination >(
124
+ (Destination destination) {
125
+ return NavigationDestination (
126
+ icon: Icon (destination.icon, color: destination.color),
127
+ label: destination.title,
128
+ );
129
+ },
130
+ ).toList (),
113
131
),
114
132
),
115
133
);
@@ -148,6 +166,7 @@ class RootPage extends StatelessWidget {
148
166
final TextStyle headlineSmall = Theme .of (context).textTheme.headlineSmall! ;
149
167
final ButtonStyle buttonStyle = ElevatedButton .styleFrom (
150
168
backgroundColor: destination.color,
169
+ foregroundColor: Colors .white,
151
170
visualDensity: VisualDensity .comfortable,
152
171
padding: const EdgeInsets .symmetric (vertical: 12 , horizontal: 16 ),
153
172
textStyle: headlineSmall,
@@ -157,6 +176,7 @@ class RootPage extends StatelessWidget {
157
176
appBar: AppBar (
158
177
title: Text ('${destination .title } RootPage - /' ),
159
178
backgroundColor: destination.color,
179
+ foregroundColor: Colors .white,
160
180
),
161
181
backgroundColor: destination.color[50 ],
162
182
body: Center (
@@ -236,15 +256,23 @@ class ListPage extends StatelessWidget {
236
256
@override
237
257
Widget build (BuildContext context) {
238
258
const int itemCount = 50 ;
259
+ final ColorScheme colorScheme = Theme .of (context).colorScheme;
239
260
final ButtonStyle buttonStyle = OutlinedButton .styleFrom (
261
+ shape: RoundedRectangleBorder (
262
+ borderRadius: BorderRadius .circular (8 ),
263
+ side: BorderSide (
264
+ color: colorScheme.onSurface.withOpacity (0.12 ),
265
+ ),
266
+ ),
240
267
foregroundColor: destination.color,
241
- fixedSize: const Size .fromHeight (128 ),
268
+ fixedSize: const Size .fromHeight (64 ),
242
269
textStyle: Theme .of (context).textTheme.headlineSmall,
243
270
);
244
271
return Scaffold (
245
272
appBar: AppBar (
246
273
title: Text ('${destination .title } ListPage - /list' ),
247
274
backgroundColor: destination.color,
275
+ foregroundColor: Colors .white,
248
276
),
249
277
backgroundColor: destination.color[50 ],
250
278
body: SizedBox .expand (
@@ -256,7 +284,11 @@ class ListPage extends StatelessWidget {
256
284
child: OutlinedButton (
257
285
style: buttonStyle.copyWith (
258
286
backgroundColor: MaterialStatePropertyAll <Color >(
259
- Color .lerp (destination.color[100 ], Colors .white, index / itemCount)! ,
287
+ Color .lerp (
288
+ destination.color[100 ],
289
+ Colors .white,
290
+ index / itemCount
291
+ )! ,
260
292
),
261
293
),
262
294
onPressed: () {
@@ -303,6 +335,7 @@ class _TextPageState extends State<TextPage> {
303
335
appBar: AppBar (
304
336
title: Text ('${widget .destination .title } TextPage - /list/text' ),
305
337
backgroundColor: widget.destination.color,
338
+ foregroundColor: Colors .white,
306
339
),
307
340
backgroundColor: widget.destination.color[50 ],
308
341
body: Container (
0 commit comments