Как мне избавиться от лишнего BottomAppBar во Flutter?
У меня есть лишний нижний колонтитул BottomAppBar, и я не хочу там находиться. Я хочу, чтобы нижняя панель навигации была вложена в нижнюю панель приложения, потому что я все еще хочу сохранить выемку для плавающей кнопки действия. На скриншоте это ясно видно, так как он окрашен в красный цвет.
Это мой код:
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(0),
child: AppBar(
elevation: 0,
backgroundColor: Colors.transparent.withOpacity(0.4),
),
),
extendBodyBehindAppBar: true,
body: Container(
width: double.infinity,
height: double.infinity,
color: Colors.blue,
),
bottomNavigationBar: bottomNavBar,
floatingActionButton: addPostButton,
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
}
Widget get bottomNavBar {
return BottomAppBar(
color: Colors.red,
shape: CircularNotchedRectangle(),
elevation: 0,
notchMargin: 10,
child: BottomNavigationBar(
elevation: 0,
items: [
BottomNavigationBarItem(
icon: Icon(MdiIcons.homeOutline),
activeIcon: Icon(MdiIcons.home),
title: Text("Home"),
),
BottomNavigationBarItem(
icon: Icon(MdiIcons.accountOutline),
activeIcon: Icon(MdiIcons.account),
title: Text("Profile"),
),
],
),
);
}
Widget get addPostButton {
return FloatingActionButton(
focusElevation: 0,
onPressed: () {},
child: Icon(
MdiIcons.mapMarkerPlusOutline,
size: 30,
),
);
}
}
1 ответ
Измените свой код, как показано ниже, затем проверьте:
Widget get bottomNavBar {
return BottomNavigationBar(
elevation: 0,
items: [
BottomNavigationBarItem(
icon: Icon(MdiIcons.homeOutline),
activeIcon: Icon(MdiIcons.home),
title: Text("Home"),
),
BottomNavigationBarItem(
icon: Icon(MdiIcons.accountOutline),
activeIcon: Icon(MdiIcons.account),
title: Text("Profile"),
),
],
);
}