Flutter 导航最佳实践答案

【问题标题】：Flutter navigation best practiceFlutter 导航最佳实践
【发布时间】：2020-01-09 06:53:13
【问题描述】：

我有一个问题要问 Flutter 开发者，他们有使用 Angular 或 android sdk 的经验。

在 android 中，当您想在不同屏幕之间导航而不降低性能时，我们使用片段并使用框架布局更改它们

对于 Angular 也是一样，我们使用路由器插座，我们使用路由在组件之间导航

我想用颤振实现同样的事情（ps：我播种了一些像one 这样的文章，作者通过更新状态和有条件地显示正确的页面在他的页面之间导航，我不认为这是好习惯）

所以我的问题是有什么方法可以像在 Angular 或 android 中那样在颤振中使用导航？

谢谢

【问题讨论】：

flutter.dev/docs/development/ui/navigation

标签： flutter dart flutter-navigation

【解决方案1】：

我有一个包含多个页面的应用程序，我使用 RouteGenerator 来管理这些路由，我也来自 Angular 背景，发现这是最好的方法，因为我的所有路由都位于一个文件中。

https://flutter.dev/docs/cookbook/navigation/named-routes

【讨论】：

您好，感谢您的回答，我添加了一张图片来解释我正在尝试做什么，我想要的只是在应用程序中的特定区域进行路由。
看起来很有趣，但这应该是一个评论，因为没有你所说的细节。

【解决方案2】：

你可以使用PageView。

  PageController pageController = PageController(initialPage: 0);
  int _selectedIndex = 0;

  void _selectCurrentTab(int index) {
    setState(() {
      _selectedIndex = index;
    });
    pageController.animateToPage(_selectedIndex,
        duration: Duration(milliseconds: 250), curve: Curves.linear);
  }      

@override
Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            appBar: ...,
            body: PageView(
              pageSnapping: true,
              controller: pageController,
              children: [HomePage(), AboutPage()],
            ),
            bottomNavigationBar: BottomNavigationBar(
              items: [
                BottomNavigationBarItem(...),
                BottomNavigationBarItem(...)
              ],
              type: BottomNavigationBarType.fixed,
              showUnselectedLabels: true,
              currentIndex: _selectedIndex,
              onTap: _selectCurrentTab,
            )));
  }

【讨论】：

【解决方案3】：

您需要的是嵌套路由。查看Link，了解如何使用 Navigator 2.0 实现嵌套路由。

【讨论】：