我正在尝试在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.
在按标签中的新页面然后切换标签之后。