[英]How do I add a button in the center both vertically and horizontally in a bottom navigation bar in flutter?
i have tried so many different ways und looked for solutions online, but could not find any.我尝试了很多不同的方法并在网上寻找解决方案,但找不到任何解决方案。 can someone please help me with this problem?
有人可以帮我解决这个问题吗? i want my button right in the middle of the bottom navigation bar like in picture 1
我希望我的按钮位于底部导航栏的中间,如图 1 所示
the button is right in the middle which is what i want按钮就在中间,这就是我想要的
this is a floating action button, however i cannot put it to the place i want这是一个浮动操作按钮,但是我不能把它放在我想要的地方
What I would do is remove/replace the FAB (Floating action button) with a BottomNavigationBarItem and put it in the center of the BottomNavigationBar and create styling for it我要做的是用BottomNavigationBarItem删除/替换FAB(浮动操作按钮)并将其放在BottomNavigationBar的中心并为其创建样式
Here is an example:这是一个例子:
bottomNavigationBar: BottomNavigationBar(
onTap: _selectTab,
showSelectedLabels: false,
showUnselectedLabels: false,
backgroundColor: Theme.of(context).primaryColor,
selectedItemColor: Theme.of(context).accentColor,
unselectedItemColor: Colors.black,
currentIndex: _selectedScreenIndex,
//type: BottomNavigationBarType.shifting,
items: [
BottomNavigationBarItem(
icon: Icon(
Icons.category,
),
label: 'Categories',
),
BottomNavigationBarItem(
icon: Container(
decoration: BoxDecoration(
color: Colors.yellow,
shape: BoxShape.circle,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: IconButton(
onPressed: () {},
icon: Icon(
Icons.add,
),
iconSize: 40,
)
// Icon(
// Icons.add,
// ),
),
),
label: 'Add',
),
BottomNavigationBarItem(
icon: Icon(
Icons.star,
),
label: 'Favorites',
),
],
),
Also there is this alternative option for the bottom navigation https://pub.dev/packages/convex_bottom_bar底部导航也有这个替代选项https://pub.dev/packages/convex_bottom_bar
flutter dart flutter-widget flutter-bottomnavigation flutter dart flutter-widget flutter-bottomnavigation
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.