如何解决嵌套 TabBar 导航中的永久 AppBar
我是 Flutter 的新手,我面临这样一个问题:
- 我有一个主文件来运行我的 web flutter 应用程序
- 我的主页文件包含
- 一个带有四个选项卡的 TabBar 的 AppBar
- 每个标签都有两个弹出菜单项
- 现在的问题是,当我点击一个菜单项时,它会将我带到其内容“DemoData”,但 AppBar 消失了,这不是我想要的
- 所以现在我想知道如果可能的话如何实现这种行为。
这是我的代码:
import 'package:flutter/material.dart';
import 'package:nested_navigation_demo/home_page.dart';
void main() {
runApp(MyApp());
}
//homePage
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: DefaultTabController(
length: 4,child: Scaffold(
appBar: AppBar(
title: Text(
'Nested Tab Navigation Demo'
),bottom: TabBar(
tabs: [
Tab(
text: 'Explore',),Tab(
text: 'Discover',Tab(
text: 'Use',Tab(
text: 'Demo',)
],body: TabBarView(
children: [
Center(
child: Container(
color:Colors.blue,child: DemoPage(),Container(
color:Colors.red,child:
DemoPage(),Container(
color:Colors.green,Container(
color:Colors.yellow,],)
),);
}
}
//Demo page
class DemoPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
// SignUpPage builds its own Navigator which ends up being a nested
// Navigator in our app.
return Navigator(
initialRoute: 'DemoData',onGenerateRoute: (RouteSettings settings) {
WidgetBuilder builder;
switch (settings.name) {
case 'DemoData':
// Assume CollectPersonalInfoPage collects personal info and then
// navigates to 'signup/choose_credentials'.
builder = (BuildContext _) => HorizontalMenu();
break;
default:
throw Exception('Invalid route: ${settings.name}');
}
return MaterialPageRoute(builder: builder,settings: settings);
},);
}
}
//horizontalMenu
class HorizontalMenu extends StatefulWidget {
//const HorizontalMenu({Key key}) : super(key: key);
@override
_HorizontalMenuState createState() => _HorizontalMenuState();
}
class _HorizontalMenuState extends State<HorizontalMenu> {
@override
Widget build(BuildContext context) {
return Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,children: [
Padding(
padding: const EdgeInsets.all(8.0),child: About(),Padding(
padding: const EdgeInsets.all(8.0),child: Stakeholders(),)
],);
}
}
//About
class About extends StatefulWidget {
//const About({Key key}) : super(key: key);
@override
_AboutState createState() => _AboutState();
}
class _AboutState extends State<About> with
AutomaticKeepAliveClientMixin<About> {
@override
bool get wantKeepAlive => true;
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return PopupMenuButton<int>(
itemBuilder: (context) => [
PopupMenuItem(
value: 1,child: Column(
children: [
ListTile(
//horizontalTitleGap:5.0,title: InkWell(
child: Text(
'Demo data1',style: TextStyle(
color: Colors.white
),onTap: (){
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (context) => DemoData(),)
);
},ListTile(
title:InkWell(
child: Text(
'Demo data2',ListTile(
title: InkWell(
child: Text(
'Demo data3',onTap: (){
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (context) => DemoData(),);
//Navigator.push(context,DemoData());
},icon: Icon(Icons.apps,color: Colors.white,size: 30.0,offset: Offset(0.0,100.0),color: Colors.black,tooltip: 'About',);
}
}
//Stakeholders
class Stakeholders extends StatefulWidget {
@override
_StakeholdersState createState() => _StakeholdersState();
}
class _StakeholdersState extends State<Stakeholders> {
@override
Widget build(BuildContext context) {
return PopupMenuButton<int>(
itemBuilder: (context) => [
PopupMenuItem(
value: 1,);
}
}
//DemoData
class DemoData extends StatefulWidget {
//const DemoData({Key key}) : super(key: key);
@override
_DemoDataState createState() => _DemoDataState();
}
class _DemoDataState extends State<DemoData> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'First demo page',body: Container(
color: Colors.purple,child: Center(
child: TextButton(
onPressed: () {
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (context) => SecondDemoData(),);
},child: Text(
'Take me to another page'
),);
}
}
//SecondDemoData
class SecondDemoData extends StatefulWidget {
//const DemoData({Key key}) : super(key: key);
@override
_SecondDemoDataState createState() => _SecondDemoDataState();
}
class _SecondDemoDataState extends State<SecondDemoData> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'Second page demo',)
),body: Container(
color: Colors.yellow,child: Center(
child: TextButton(
onPressed: () {
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (context) => DemoData(),)
);
},child: Text(
'Take me to another page'
),);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。