I have a page in my app that shows a message saying ‘Feature is implementing’, and it has a back button to return to the same route the user was on before. I have tried using navigator.pop() and keeping the history, but neither of those solutions have worked. I have also tried adding an extra parameter to the route, but it doesn’t seem to be working as expected.
I am using GoRouter, and I have defined a route for the ‘Feature is implementing’ page like this:
router.dart
GoRoute(
path: '/coming-soon/:previousRoute',
pageBuilder: (context, state) {
final previousRoute = state.params['previousRoute'];
return MaterialPage(
key: ValueKey('coming-soon'),
child: AppComingSoon(previousRoute: previousRoute),
);
},
),
And here is the code for the AppComingSoon widget:
class AppComingSoon extends StatelessWidget {
final String? previousRoute;
final String? extraData;
const AppComingSoon({Key? key, this.previousRoute, this.extraData})
: super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
extendBodyBehindAppBar: true,
appBar: AppBar(
titleSpacing: 4,
leading: IconButton(
icon: const Icon(PhosphorIcons.arrowLeft),
onPressed: () {
(context).go("/$previousRoute");
},
),
elevation: 0,
title: Text(context.l10n.buttonBack),
),
body: Column(
children: [
Container(
width: SizeConfig.screenWidth,
height: SizeConfig.screenHeight * 0.55,
decoration: BoxDecoration(
image: DecorationImage(
image: Image.asset(
'assets/Graphics/coming-soon.png',
).image,
fit: BoxFit.fill,
alignment: Alignment.topCenter,
),
),
),
SizedBox(
height: getProportionateScreenWidth(16),
),
Padding(
padding: EdgeInsets.only(
left: getProportionateScreenWidth(20),
right: getProportionateScreenWidth(20),
),
child: Column(
children: [
Text(
"implementing this feature in the app.",
style: Theme.of(context).textTheme.substitleSemiBold,
textAlign: TextAlign.center,
),
SizedBox(
height: getProportionateScreenWidth(16),
),
Text(
"If you need support with this topic",
style: Theme.of(context).textTheme.body1Regular,
textAlign: TextAlign.center,
),
],
),
),
],
),
);
}
}
I am calling the ‘Feature is implementing’ page from multiple places in my app, including this example code for the GoalsPageBodyGoals widget:
class GoalsPageBodyGoals extends StatelessWidget {
final List<Widget> data;
const GoalsPageBodyGoals({Key? key, required this.data}) : super(key: key);
@override
Widget build(BuildContext context) {
return Column(children: [
...data,
const SizedBox(height: 24),
Column(
key: const Key('goals_page_action_buttons'),
children: [
AppButtons.button(
onPressed: () => context.go('/add-goal'),
child: Text(context.l10n.goalsListPrimaryButtonText)),
AppButtons.textButton(
onPressed: () => context.go('/coming-soon/goals'),
phosphorIcon: PhosphorIcons.arrowRight,
child: Text(context.l10n.goalsListTextLink),
),
],
),
]);
}
}
Please help!
2
Answers
this solution worked for me
and in the back button
You can use
context.pop();
to pop like we do on navigator1navigator.pop()
.and navigator.push is like
context.push()
andcontext.pushNamed()
.