不停颤动导航



我正在使用Fluro,但我认为在这种情况下这无关紧要。

我有一个带有两个不同图标的BottomNavigationBar。在每个选项卡上,我想使用导航器走另一条路线。是否可以使用导航器设置路线,而无需任何动画和后退按钮?

Navigator仅用于在两个不同的路线之间导航(说两个完全不同的屏幕或视图(。 BottomNavigationBar不会将我们带到新屏幕,而是用于更改当前路线的视图。您可以通过多种方式实现它。

一个带有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,
      ),
    );
  }
}

您可以在此处查看另一个示例,该示例使用 Stack 执行BottomNavigationBar操作。

希望有帮助!

最新更新