Skip to content

Commit 12e5e0b

Browse files
committed
+Implement proper backward and forward routing
1 parent afe3df4 commit 12e5e0b

11 files changed

Lines changed: 367 additions & 1002 deletions

File tree

README.md

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -69,9 +69,9 @@ final class ChatRouteState extends BaseChatRouteState {
6969
}
7070
```
7171

72-
### 2. Configure RouteStateManager
72+
### 2. Configure RouteManager
7373

74-
In your MaterialApp (or CupertinoApp), use the RouteStateManager widget to define your application's routing configuration.
74+
In your MaterialApp (or CupertinoApp), use the RouteManager widget to define your application's routing configuration.
7575

7676
```dart
7777
class MyApp extends StatelessWidget {
@@ -80,31 +80,40 @@ class MyApp extends StatelessWidget {
8080
@override
8181
Widget build(BuildContext context) {
8282
return MaterialApp(
83-
//home: // Do not use "home", as it conflicts with RouteManager. Use
84-
// "builder" instead.
85-
builder: (context, child) {
86-
return RouteManager(
87-
fallbackRouteState: () => HomeRouteState(),
88-
builders: [
89-
RouteBuilder(
90-
routeState: HomeRouteState(),
91-
// Pre-build the HomeScreen even if the initial route is not
92-
// HomeRouteState. This is useful for performance optimization.
93-
shouldPrebuild: true,
94-
// Preserve the HomeScreen widget to avoid rebuilding it.
95-
shouldPreserve: true,
96-
builder: (context, routeState) => HomeScreen(routeState: HomeRouteState()),
97-
),
98-
RouteBuilder(
99-
// Use the BaseChatRouteState instead of the ChatRouteState
100-
// since it does not require a chatId to be pushed.
101-
routeState: BaseChatRouteState(),
102-
builder:
103-
(context, routeState) => ChatScreen(routeState: ChatRouteState.from(routeState)),
83+
home: Material(
84+
type: MaterialType.transparency,
85+
child: Overlay(
86+
initialEntries: [
87+
OverlayEntry(
88+
maintainState: true,
89+
builder: (context) {
90+
return RouteManager(
91+
fallbackRouteState: () => HomeRouteState(),
92+
builders: [
93+
RouteBuilder(
94+
routeState: HomeRouteState(),
95+
// Pre-build the HomeScreen even if the initial route is not
96+
// HomeRouteState. This is useful for performance optimization.
97+
shouldPrebuild: true,
98+
// Preserve the HomeScreen widget to avoid rebuilding it.
99+
shouldPreserve: true,
100+
builder: (context, routeState) =>
101+
HomeScreen(routeState: HomeRouteState()),
102+
),
103+
RouteBuilder(
104+
// Use the BaseChatRouteState instead of the ChatRouteState
105+
// since it does not require a chatId to be pushed.
106+
routeState: BaseChatRouteState(),
107+
builder: (context, routeState) => ChatScreen(
108+
routeState: ChatRouteState.from(routeState)),
109+
),
110+
],
111+
);
112+
},
104113
),
105114
],
106-
);
107-
},
115+
),
116+
),
108117
);
109118
}
110119
}
@@ -160,14 +169,14 @@ class ChatScreen extends StatelessWidget with RouteWidgetMixin {
160169
ElevatedButton(
161170
onPressed: () {
162171
final controller = RouteController.of(context);
163-
controller.pushBack();
172+
controller.goBack();
164173
},
165174
child: const Text('Go Back - Default Effect'),
166175
),
167176
ElevatedButton(
168177
onPressed: () {
169178
final controller = RouteController.of(context);
170-
controller.pushBack(animationEffect: const QuickBackEffect());
179+
controller.goBack(animationEffect: const QuickBackEffect());
171180
},
172181
child: const Text('Go Back - Quick Back Effect'),
173182
),

example/example.dart

Lines changed: 50 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,24 @@ void main() {
1111

1212
final class HomeRouteState extends RouteState {
1313
HomeRouteState()
14-
: super.parse(
15-
'/home',
16-
// Use QuickForwardtEffect() as the default transtion effect for this
17-
// route. This can be overridden when pushing this route.
18-
animationEffect: const ForwardEffectWeb(),
19-
);
14+
: super.parse(
15+
'/home',
16+
// Use QuickForwardtEffect() as the default transtion effect for this
17+
// route. This can be overridden when pushing this route.
18+
animationEffect: const ForwardEffectWeb(),
19+
);
2020
}
2121

2222
// This route is only used in the RouteManager, so it does not need to
2323
// be pushed directly. It is a base route for the chat feature.
2424
final class BaseChatRouteState extends RouteState {
2525
BaseChatRouteState({Map<String, String>? queryParameters})
26-
: super.parse(
27-
'/chat',
28-
queryParameters: queryParameters,
29-
// Use a different animation effect for this route.
30-
animationEffect: const SlideDownEffect(),
31-
);
26+
: super.parse(
27+
'/chat',
28+
queryParameters: queryParameters,
29+
// Use a different animation effect for this route.
30+
animationEffect: const SlideDownEffect(),
31+
);
3232

3333
BaseChatRouteState.from(RouteState other) : super(other.uri);
3434
}
@@ -37,11 +37,11 @@ final class ChatRouteState extends BaseChatRouteState {
3737
final String chatId;
3838

3939
ChatRouteState({required this.chatId})
40-
: super(queryParameters: {'chatId': chatId});
40+
: super(queryParameters: {'chatId': chatId});
4141

4242
ChatRouteState.from(super.other)
43-
: chatId = other.uri.queryParameters['chatId'] ?? '',
44-
super.from();
43+
: chatId = other.uri.queryParameters['chatId'] ?? '',
44+
super.from();
4545
}
4646

4747
class MyApp extends StatelessWidget {
@@ -50,32 +50,41 @@ class MyApp extends StatelessWidget {
5050
@override
5151
Widget build(BuildContext context) {
5252
return MaterialApp(
53-
//home: // Do not use "home", as it conflicts with RouteManager. Use
54-
// "builder" instead.
55-
builder: (context, child) {
56-
return RouteManager(
57-
fallbackRouteState: () => HomeRouteState(),
58-
builders: [
59-
RouteBuilder(
60-
routeState: HomeRouteState(),
61-
// Pre-build the HomeScreen even if the initial route is not
62-
// HomeRouteState. This is useful for performance optimization.
63-
shouldPrebuild: true,
64-
// Preserve the HomeScreen widget to avoid rebuilding it.
65-
shouldPreserve: true,
66-
builder: (context, routeState) =>
67-
HomeScreen(routeState: HomeRouteState()),
68-
),
69-
RouteBuilder(
70-
// Use the BaseChatRouteState instead of the ChatRouteState
71-
// since it does not require a chatId to be pushed.
72-
routeState: BaseChatRouteState(),
73-
builder: (context, routeState) =>
74-
ChatScreen(routeState: ChatRouteState.from(routeState)),
53+
home: Material(
54+
type: MaterialType.transparency,
55+
child: Overlay(
56+
initialEntries: [
57+
OverlayEntry(
58+
maintainState: true,
59+
builder: (context) {
60+
return RouteManager(
61+
fallbackRouteState: () => HomeRouteState(),
62+
builders: [
63+
RouteBuilder(
64+
routeState: HomeRouteState(),
65+
// Pre-build the HomeScreen even if the initial route is not
66+
// HomeRouteState. This is useful for performance optimization.
67+
shouldPrebuild: true,
68+
// Preserve the HomeScreen widget to avoid rebuilding it.
69+
shouldPreserve: true,
70+
builder: (context, routeState) =>
71+
HomeScreen(routeState: HomeRouteState()),
72+
),
73+
RouteBuilder(
74+
// Use the BaseChatRouteState instead of the ChatRouteState
75+
// since it does not require a chatId to be pushed.
76+
routeState: BaseChatRouteState(),
77+
builder: (context, routeState) => ChatScreen(
78+
routeState: ChatRouteState.from(routeState),
79+
),
80+
),
81+
],
82+
);
83+
},
7584
),
7685
],
77-
);
78-
},
86+
),
87+
),
7988
);
8089
}
8190
}
@@ -127,14 +136,14 @@ class ChatScreen extends StatelessWidget with RouteWidgetMixin {
127136
ElevatedButton(
128137
onPressed: () {
129138
final controller = RouteController.of(context);
130-
controller.pushBack();
139+
controller.goBack();
131140
},
132141
child: const Text('Go Back - Default Effect'),
133142
),
134143
ElevatedButton(
135144
onPressed: () {
136145
final controller = RouteController.of(context);
137-
controller.pushBack(animationEffect: const BackwardEffectWeb());
146+
controller.goBack(animationEffect: const BackwardEffectWeb());
138147
},
139148
child: const Text('Go Back - Quick Back Effect'),
140149
),

0 commit comments

Comments
 (0)