I have been struggling to figure out how to navigate back to my bottom navigation bar after navigating to a page without it. Using Navigator pop does not work and produces an error, I have looked at other questions where people asked the same thing, but no one seems to answer this question everyone just explains how to navigate between different items within the Navigation Bar... which is easy.
Below is the code of the Navigation bar, which works without any problems. Again I CAN navigate between different Navigation Bar pages easily.
`import 'package:google_nav_bar/google_nav_bar.dart';
import 'package:flutter/material.dart';
import '../../Screens/screens_export.dart';
class GoogleNavBar extends StatefulWidget {
const GoogleNavBar({Key? key}) : super(key: key);
@override
State<GoogleNavBar> createState() => _GoogleNavBarState();
}
class _GoogleNavBarState extends State<GoogleNavBar> {
int currentIndex = 2;
final Screens = [
nderChat(),
TBD(),
Reports(),
Drawer(),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Screens[currentIndex],
bottomNavigationBar: Container(
color: Colors.black,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 15,
vertical: 20),
child: GNav(
backgroundColor: Colors.black,
color: Colors.white,
activeColor: Colors.white,
tabBackgroundColor: Colors.grey.shade800,
padding: EdgeInsets.all(16),
gap: 8,
onTabChange: (index) => setState(() => currentIndex = index),
tabs: const[
GButton(
icon: Icons.groups_outlined,
text: 'Global',
),
GButton(
icon: Icons.rss_feed_outlined,
text: 'TBD',
),
GButton(
icon: Icons.running_with_errors_rounded,
text: 'Alerts',
),
// GButton(
// icon: Icons.sports,
// text: 'Reports',
// ),
GButton(
icon: Icons.account_circle_outlined,
text: 'Profile',
),
]
),
),
),
);
}
}
In the Screen Drawer, I open a drawer, which probably isn't a good practice. Clicking one of the Drawer options takes me to another page such as a Profile Page(which is not part of the Nav Bar).
After navigating to Profile, when I do "Navigation Pop" it gives me "route error".
I do not know what to do, I have tried using Pushnamed, but also gave me a error, perhaps I did it wrong.
A similar question which went unanswered : Flutter pass bottom navigation bar selected index when navigating back to page with bottom nav bar
CodePudding user response：
Profil page is piece of bottom navigation.
onWillPop: () async {
if (_currentIndex != 0) {
setState(() {
_currentIndex = 0;
});
return false;
} else {
}
return widget.go_back;
},
you should use like that. (main.dart)
return WillPopScope(
onWillPop: () async {
if (currentIndex != 0) {
setState(() {
currentIndex = 0;
});
return false;
}
},
child:Scaffold(
body: Screens[currentIndex],
bottomNavigationBar: Container(
color: Colors.black,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 15,
vertical: 20),
child: GNav(
backgroundColor: Colors.black,
color: Colors.white,
activeColor: Colors.white,
tabBackgroundColor: Colors.grey.shade800,
padding: EdgeInsets.all(16),
gap: 8,
onTabChange: (index) => setState(() => currentIndex = index),
tabs: const[
GButton(
icon: Icons.groups_outlined,
text: 'Global',
),
GButton(
icon: Icons.rss_feed_outlined,
text: 'TBD',
),
GButton(
icon: Icons.running_with_errors_rounded,
text: 'Alerts',
),
// GButton(
// icon: Icons.sports,
// text: 'Reports',
// ),
GButton(
icon: Icons.account_circle_outlined,
text: 'Profile',
),
]
),
),
),
)
);
CodePudding user response：
To add some more information:
class ModalDrawer extends StatelessWidget {
const ModalDrawer({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
double drawerWidth = MediaQuery.of(context).size.width;
return Drawer(
width: drawerWidth,
backgroundColor: Colors.lightBlue,
child: ListView(
padding: const EdgeInsets.all(0),
children: [
const DrawerHeader(
decoration: BoxDecoration(
color: Colors.blueGrey,
// image: DecorationImage(
// image: AssetImage("assets/images/city_night.jpg"),
// fit: BoxFit.cover)
),
child: UserAccountsDrawerHeader(
decoration: BoxDecoration(color: Colors.blue),
accountName: Text(
"Alpha",
style: TextStyle(fontSize: 18),
),
accountEmail: Text("[email protected]"),
currentAccountPictureSize: Size.square(50),
currentAccountPicture: CircleAvatar(
backgroundColor: Colors.blue,
child: Text(
"A",
style: TextStyle(
fontSize: 30.0,
color: Color.fromARGB(255, 255, 255, 255)),
),
),
),
),
buildMenuItem(
text: AppLocalizations.of(context)!.home,
icon: Icons.home_outlined,
onClicked: () => selectedItem(context, 0),
// selectedColor: Colors.white,
// selected: true,
),
buildMenuItem(
text: AppLocalizations.of(context)!.profile,
icon: Icons.person_outline,
onClicked: () => selectedItem(context, 1),
// selectedColor: Colors.white,
// selected: true,
),
buildMenuItem(
text: AppLocalizations.of(context)!.faq,
icon: Icons.question_mark_outlined,
onClicked: () => selectedItem(context, 2),
// selectedColor: Colors.white,
// selected: true,
),
buildMenuItem(
text: AppLocalizations.of(context)!.settings,
icon: Icons.settings,
onClicked: () => selectedItem(context, 3),
// selectedColor: Colors.white,
// selected: true,
),
buildMenuItem(
text: 'chat',
icon: Icons.message_outlined,
onClicked: () => {
showDialog(context: context, builder: (context) => SimpleDialogBox()),
selectedItem(context, 4),},
// selectedColor: Colors.white,
),
],
),
);
}
//
Widget buildMenuItem({
required String text,
required IconData icon,
required onClicked,
// required selectedColor,
// required selected,
}) {
const colorImage = Color.fromARGB(255, 3, 3, 3);
const colorText = Color.fromARGB(255, 0, 0, 0);
return Padding(
padding: const EdgeInsets.only(bottom: 1),
child: ListTile(
leading: Icon(icon, color: colorImage),
title: Text(text, style: const TextStyle(color: colorText)),
onTap: onClicked,
// selectedTileColor: selectedColor,
// selected: selected,
),
);
}
void selectedItem(BuildContext context, int index) {
Navigator.of(context).pop();
switch (index) {
case 0:
Navigator.pushNamed(context, '/home');
break;
case 1:
Navigator.pushNamed(context, '/user');
break;
case 2:
Navigator.pushNamed(context, '/faq');
break;
case 3:
Navigator.pushNamed(context, '/settings');
break;
case 4:
Navigator.pushNamed(context, '/chatscreen');
break;
}
}
}
here are some screenshots
