Routes in flutter web have unexpected behavior
It looks like an update to flutter now solves this question. The expected behavior now happens when using the Navigator.
Comments
-
Emmett Deen over 1 year
When using the built in scaffold / app bar in flutter for flutter web, when pushing new routes using the navigator a back button is still shown on the app bar and the url in the browser goes unchanged. This means the browser's back button does not work which is a very strange UX. Is there a way to get around this?
I have already tried pushing the route in many different ways (pushReplacement gets rid of the back button, but the browser back button still does not work)
HomeScreen.dart
@override State<StatefulWidget> createState() { return HomeScreenState(); } } class HomeScreenState extends State<HomeScreen> { @override Widget build(BuildContext context) { return Scaffold( endDrawer: Navbar.buildDrawer(context), appBar: Navbar.buldNavbar(context), body: _buildBody(), ); } Widget _buildBody(){ return Text('Home'); } }
Navbar.dart
static Drawer buildDrawer(BuildContext context) { return Drawer( child: ListView( children: <Widget>[ ListTile( title: Text('Home'), leading: Icon(Icons.home), onTap: (){ Navigator.of(context).pushReplacementNamed('/'); }, ), ListTile( title: Text('About Us'), leading: Icon(Icons.people), onTap: (){ Navigator.of(context).pushReplacementNamed('/about'); }, ), ListTile( title: Text('Contact'), leading: Icon(Icons.contact_mail), onTap: (){ Navigator.of(context).pushReplacementNamed('/contact'); }, ) ], ), ); } static AppBar buldNavbar(BuildContext context) { return AppBar( title: FlatButton( child: Padding( padding: EdgeInsets.all(8), child: Image.asset('assets/whiteLogo.png'), ), onPressed: () { Navigator.of(context).pushNamed('/'); }, ), ); } }
I would expect the routes to change the url in browser, enabling us to use the back button and other functionality of normal routing, but the actual result is the same route displaying in the browser and having to use the automatic AppBar back button