forked from BilalShahid13/PersistentBottomNavBar
/
go_router_example.dart
148 lines (141 loc) · 4.78 KB
/
go_router_example.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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
import "package:example/screens.dart";
import "package:flutter/material.dart";
import "package:go_router/go_router.dart";
import "package:persistent_bottom_nav_bar_v2/persistent_bottom_nav_bar_v2.dart";
class GoRouterExample extends StatelessWidget {
GoRouterExample({super.key});
final _parentKey = GlobalKey<NavigatorState>();
final _shellKey = GlobalKey<NavigatorState>();
final subRoutes = GoRoute(
path: "detail",
builder: (context, state) => const MainScreen2(
useRouter: true,
),
routes: [
GoRoute(
path: "super-detail",
builder: (context, state) => const MainScreen3(),
),
],
);
late final GoRouter goRouter = GoRouter(
/// If you want the app to start on the first tab use this:
// initialLocation: "/home",
navigatorKey: _parentKey,
routes: [
GoRoute(
path: "/",
builder: (context, state) => Material(
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ElevatedButton(
onPressed: () => context.go("/home"),
child: const Text("Show Router Example"),
),
const SizedBox(height: 16),
const Padding(
padding: EdgeInsets.symmetric(horizontal: 32),
child: Text(
"This screen could be something you require the user to do before entering the main app content (like a login form)",
),
),
],
),
),
),
routes: [
StatefulShellRoute.indexedStack(
builder: (context, state, navigationShell) =>
PersistentTabView.router(
tabs: [
PersistentRouterTabConfig(
item: ItemConfig(
icon: const Icon(Icons.home),
title: "Home",
),
),
PersistentRouterTabConfig(
item: ItemConfig(
icon: const Icon(Icons.message),
title: "Messages",
),
),
PersistentRouterTabConfig(
item: ItemConfig(
icon: const Icon(Icons.settings),
title: "Settings",
),
),
],
navBarBuilder: (navBarConfig) => Style1BottomNavBar(
navBarConfig: navBarConfig,
),
navigationShell: navigationShell,
),
branches: [
// The route branch for the 1st Tab
StatefulShellBranch(
navigatorKey: _shellKey,
routes: <RouteBase>[
GoRoute(
path: "home",
builder: (context, state) => const MainScreen(
useRouter: true,
),
routes: [
/// When you use the navigator Key that of the root navigator, this and all the sub routes will be pushed to the root navigator (-> without the navbar)
GoRoute(
parentNavigatorKey: _parentKey,
path: "detail",
builder: (context, state) => const MainScreen2(
useRouter: true,
),
routes: [
GoRoute(
path: "super-detail",
builder: (context, state) => const MainScreen3(),
),
],
),
],
),
],
),
// The route branch for 2nd Tab
StatefulShellBranch(
routes: <RouteBase>[
GoRoute(
path: "messages",
builder: (context, state) => const MainScreen(
useRouter: true,
),
routes: [subRoutes],
),
],
),
// The route branch for 3rd Tab
StatefulShellBranch(
routes: <RouteBase>[
GoRoute(
path: "settings",
builder: (context, state) => const MainScreen(
useRouter: true,
),
routes: [subRoutes],
),
],
),
],
),
],
),
],
);
@override
Widget build(BuildContext context) => MaterialApp.router(
title: "Persistent Bottom Navigation Bar Demo",
routerConfig: goRouter,
);
}