本文介绍了如何在Navigator中使用BottomNavigationBar?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
BottomNavigationBar 的Flutter Gallery示例使用 FadeTransitions $ c的 Stack 脚手架中的$ c>。
The Flutter Gallery example of BottomNavigationBar uses a Stack of FadeTransitions in the body of the Scaffold.
我觉得它会更干净(更容易制作动画)如果我们可以使用 Navigator 来切换页面。
I feel it would be cleaner (and easier to animate) if we could switch pages by using a Navigator.
有没有这样的例子?
推荐答案
int index = 0; @override Widget build(BuildContext context) { return new Scaffold( body: new Stack( children: <Widget>[ new Offstage( offstage: index != 0, child: new TickerMode( enabled: index == 0, child: new MaterialApp(home: new YourLeftPage()), ), ), new Offstage( offstage: index != 1, child: new TickerMode( enabled: index == 1, child: new MaterialApp(home: new YourRightPage()), ), ), ], ), bottomNavigationBar: new BottomNavigationBar( currentIndex: index, onTap: (int index) { setState((){ this.index = index; }); }, items: <BottomNavigationBarItem>[ new BottomNavigationBarItem( icon: new Icon(Icons.home), title: new Text("Left"), ), new BottomNavigationBarItem( icon: new Icon(Icons.search), title: new Text("Right"), ), ], ), ); }
您应将每个页面保留在 Stack 保持其状态。
后台停止绘画, TickerMode 停止动画。
MaterialApp 包括 Navigator 。
You should keep each page by Stack to keep their state.Offstage stops painting, TickerMode stops animation.MaterialApp includes Navigator.
这篇关于如何在Navigator中使用BottomNavigationBar?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!