如何解决如何在颤动中一起创建抽屉和底部导航栏？
我到处搜索，但我找不到如何在Flutter中一起使用抽屉和底部导航栏？
我创建了两个 ui，因为两者都显示良好。主要问题是我可以在 body 中导航抽屉的项目类或底部导航栏类。如果单击底部项目，则应加载底部类，当单击抽屉项目时，应加载其类。
我的代码在下面，如果有任何错误，请查看代码或建议我任何示例。提前致谢！！
'''
//for setting title name of side bar items
class DrawerItem {
String title;
IconData icon;
DrawerItem(this.title,this.icon);
}
//for setting title name of bottom bar items
// class widgetBottomItems{
// String title;
// IconData icon;
// widgetBottomItems(this.title,this.icon);
// }
class DrawerSetting extends StatefulWidget {
final drawerItems = [
new DrawerItem("Add Manual FD",Icons.add),new DrawerItem("Zero Balance Portfolio",Icons.alarm),new DrawerItem("Message",Icons.message),new DrawerItem("My Info & Setting",Icons.settings),new DrawerItem("Support",Icons.help),new DrawerItem("FAQ",Icons.book_outlined),new DrawerItem("Contact Us",Icons.contact_phone_outlined),new DrawerItem("logout",Icons.logout)
];
@override
State<StatefulWidget> createState() {
return new HomePageState();
}
}
class HomePageState extends State<DrawerSetting> {
final Color myColor = Color(0xFF15A2EB);
final Color myColorLightGray = Color(0xFF989E9E);
final Color text_Semi_Black_Color = Color(0xFF414B51);
final Color text_gray_color = Color(0xFF70787C);
int _selectedDrawerIndex = 0;
//bottom navigation
int _selectedindex = 0;
var _screens = [
discoverScreen(),HomeFragment(),PartneRSScreen(),// HistoryScreen(),AppHistoryTabScreen(),];
static const TextStyle optionStyle = TextStyle(
fontSize: 16,fontWeight: FontWeight.bold,color: Colors.red,fontFamily: "verdana_regular",);
static const List<Widget> widgetBottomItems = <Widget>[
Text(
'discover',style: optionStyle,),Text(
'Portfolio',Text(
'Partners',Text(
'History',];
String currentProfilePic =
"https://service2home.in/wp-content/uploads/2021/01/rakesh.jpg";
_getDrawerItemWidget(int pos) {
switch (pos) {
case 0:
return new AddManualFdFragment();
break;
case 1:
return new ZeroBalancePortFolioScreen();
break;
case 2:
return MessageFragment();
break;
case 3:
return new UserProfileScreen("drawer");
break;
case 4:
return new SupportFragment();
break;
case 5:
return new FAQFragment();
break;
case 6:
return new ContactUsScreen();
break;
case 7:
SystemNavigator.pop();
//exit(0);
break;
}
}
//for bottom items
void _onItemTapped(int index) {
setState(() {
_selectedindex = index;
//calling both items
// _onSelectItem(index);
});
}
//for drawer items
_onSelectItem(int index) {
setState(() => _selectedDrawerIndex = index);
Navigator.of(context).pop(); // close the drawer
}
@override
Widget build(BuildContext context) {
List<Widget> drawerOptions = [];
for (var i = 0; i < widget.drawerItems.length; i++) {
var d = widget.drawerItems[i];
drawerOptions.add(new ListTile(
leading: new Icon(
d.icon,title: new Text(
d.title,style: TextStyle(
fontSize: 16,color: myColorLightGray,selected: i == _selectedDrawerIndex,onTap: () => _onSelectItem(i),));
}
//on backpress return to home screen,you can use it for drawer items
return WillPopScope(
onWillPop: () {
if (_selectedindex != 0) {
setState(() {
_selectedindex = 0;
});
_getDrawerItemWidget(_selectedindex);
} else {
Navigator.pop(context,true);
}
return;
},child: Scaffold(
appBar: new AppBar(
title: new Text(
widget.drawerItems[_selectedDrawerIndex].title,style: TextStyle(
color: Colors.white,fontSize: 16,fontFamily: "verdana_regular"),drawer: new Drawer(
child: SingleChildScrollView(
child: new Column(
children: [
UserAccountsDrawerHeader(
currentAccountPicture: Container(
child: new GestureDetector(
child: new CircleAvatar(
backgroundImage: new NetworkImage(currentProfilePic),onTap: () => Navigator.push(
context,MaterialPageRoute(
builder: (context) => UserProfileScreen("header")),accountName: new Text(
"Rakesh saini",style: TextStyle(
fontSize: 18,color: Colors.black,accountEmail: new Text(
"rakesh.ollosoft@gmail.com",style: TextStyle(
fontSize: 15,color: Colors.white,Column(children: drawerOptions)
],body: /*_screens[_selectedindex]*/
_getDrawerItemWidget(_selectedDrawerIndex),//bottom navigation bar
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,backgroundColor: myColor,items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.search),label: 'discover',BottomNavigationBarItem(
icon: ImageIcon(
Assetimage("assets/images/briefcase.png"),// color: Colors.grey,label: 'Portfolio',BottomNavigationBarItem(
icon: ImageIcon(
Assetimage("assets/images/handshake.png"),label: 'Partners',BottomNavigationBarItem(
icon: Icon(Icons.history),label: 'History',],currentIndex: _selectedindex,selectedItemColor: Colors.white,unselectedItemColor: myColorLightGray,onTap: _onItemTapped,// bottomNavigationBar: BottomNavigationBar(),);
}
//go to news detail page
void goToProfile_Screen(BuildContext ctx) {
Navigator.of(ctx).push(
MaterialPageRoute(
builder: (_) {
return UserProfileScreen("drawer");
},);
}
}
'''
解决方法
首先我的朋友这是一个非常糟糕的代码。
在下面的这段代码中，我有你想要的两个东西，你可以按照这个路径
FooterNavigationBar 只是一个有状态的小部件，有一些行和容器，没什么特别的
Scaffold(
key: _scaffoldKey,bottomNavigationBar: FooterNavigationBar(),drawer: AppDrawer(
scaffoldKey: _scaffoldKey,),backgroundColor: CBase().backgroundColor,body: ......
InkWell(
onTap: () {
_scaffoldKey.currentState.openDrawer();
},child: SvgPicture.asset(
"images/DrawerIcon.svg"),...............
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。