Reputation: 75
I am using Fluro but I think that doesn't matter in this case.
I have a BottomNavigationBar
with two different icons. On each tab I want to use the navigator to go the other route. Is it possible to use the Navigator to set a route without any animation and back button?
Upvotes: 1
Views: 1848
Reputation: 34829
Navigator
is used only to navigate between two different routes (Say completely two different screens or views). BottomNavigationBar
does not take us to new screen but is used to change the view of current route. You can achieve it many ways.
An example with PageView
:
void main() {
runApp(new MaterialApp(
title: "Example",
home: new BottomNav(),
));
}
class BottomNav extends StatefulWidget {
@override
_BottomNavState createState() => new _BottomNavState();
}
class _BottomNavState extends State<BottomNav> {
PageController _controller = new PageController();
int _currentPage = 0;
void _onBottomNavChange(int index) {
_controller.animateToPage(index,
duration: new Duration(milliseconds: 200), curve: Curves.ease);
setState(() {
_currentPage = index;
});
}
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new PageView(controller: _controller, children: [
new Container(color: Colors.red),
new Container(color: Colors.blue),
]),
bottomNavigationBar: new BottomNavigationBar(
items: [
new BottomNavigationBarItem(
icon: new Icon(Icons.arrow_left), title: new Text("Left")),
new BottomNavigationBarItem(
icon: new Icon(Icons.arrow_right), title: new Text("Right")),
],
onTap: _onBottomNavChange,
currentIndex: _currentPage,
),
);
}
}
You can take a look at another example here, which uses Stack
for BottomNavigationBar
actions.
Hope that helped!
Upvotes: 3