4

我正在尝试在 Flutter 中设置一个多页应用程序，其中底部标签栏包含四个最常用的页面，包括一个“更多”按钮。更多按钮显示带有指向其他页面的链接的页面。当点击一个页面时，我希望这个页面替换“更多”页面，因此创建了一个新的导航堆栈。但是，当切换到另一个选项卡然后返回“更多”选项卡时，会记住导航状态。这意味着我没有看到“更多”页面，而是我在切换标签时留下的页面。每次用户单击“更多”选项卡时，我都想显示“更多”页面。

我尝试使用导航器的 pushReplacement 方法，因此当用户单击更多页面时，他无法导航回更多页面列表。但是，在切换选项卡时，不再显示更多页面，因为它已被替换。

我还尝试调整选项卡回调方法，以弹出所有视图并将导航器返回到 MoreScreen。但是，这让我在控制台中出现错误：setState() or markNeedsBuild() called during build..

选项卡屏幕：

class TabScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return TabScreenState();
  }
}

class TabScreenState extends State<TabScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: WillPopScope(
        // Prevent swipe popping of this page. Use explicit exit buttons only.
        onWillPop: () => Future<bool>.value(true),
        child: CupertinoTabScaffold(
          tabBar: CupertinoTabBar(
            items: const <BottomNavigationBarItem>[
              BottomNavigationBarItem(
                icon: Icon(Icons.home),
                title: Text('Artikelen'),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.message),
                title: Text('Activiteiten'),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.speaker_group),
                title: Text('Training'),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.more),
                title: Text('Meer'),
              ),
            ],
          ),
          tabBuilder: (BuildContext context, int index) {
            assert(index >= 0 && index <= 3);
            switch (index) {
              case 0:
                return CupertinoTabView(
                  builder: (BuildContext context) {
                    Navigator.of(context).popUntil((route) => route.isFirst);

                    return ArticleListScreen();
                  },
                  defaultTitle: 'Artikelen',
                );
                break;
              case 1:
                return CupertinoTabView(
                  builder: (BuildContext context) => ActivityListScreen(),
                  defaultTitle: 'Activiteiten',
                );
                break;
              case 2:
                return CupertinoTabView(
                  builder: (BuildContext context) => ArticleListScreen(),
                  defaultTitle: 'Training',
                );
                break;
              case 3:
                return CupertinoTabView(
                  builder: (BuildContext context) {
                    Navigator.of(context).popUntil((route) => route.isFirst);

                    return MoreScreen();
                  },
                  defaultTitle: 'Meer',
                );
                break;
            }
            return null;
          },
        ),
      ),
    );
  }
}

还有MoreScreen，它持有一个按钮可以转到另一个页面：

class MoreScreen extends StatefulWidget {
  @override 
  State<StatefulWidget> createState() {
    return MoreScreenState();
  }
}

class MoreScreenState extends State<MoreScreen> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        color: ThemeData.dark().accentColor,
        alignment: AlignmentDirectional(0.0, 0.0),
        child: MaterialButton(
          child: Text('PUSH page'),
          onPressed: () => {
            Navigator.of(context).push(MaterialPageRoute(builder: (context) => ArticleListScreen()))
          },
        )
      ),
    );
  }
}

我希望每次切换标签时导航堆栈都会重置，但现在我必须手动使用：

Navigator.of(context).popUntil((route) => route.isFirst);

这会导致错误消息：setState() or markNeedsBuild() called during build.在标签中推送新页面然后切换标签后。

4

0 回答 0