[英]Remove default padding or margin on Bottom Navigation Bar from Flutter
This is the picture of the problem, is it a default padding on Bottom Navigation Bar?这是问题的图片,它是底部导航栏上的默认填充吗? If it is, how can I remove it?如果是,我该如何删除它?
As you can see in the code below, I have a container and a icon inside of the BottomNavigationBarItem, but there is a space between the icon and the bar.正如您在下面的代码中看到的,我在 BottomNavigationBarItem 中有一个容器和一个图标,但图标和栏之间有一个空格。
return Scaffold(
bottomNavigationBar: BottomNavigationBar(
backgroundColor: Color.fromARGB(255, 18, 124, 157),
items: <BottomNavigationBarItem>[
BottomNavigationBarItem(
activeIcon: Container(
margin: EdgeInsets.all(0),
padding: EdgeInsets.all(0),
height: 50,
width: 300,
color: Color.fromARGB(255, 18, 124, 157),
child: Icon(Icons.home, size: 40, color: Colors.white),
),
icon: Container(
margin: EdgeInsets.all(0),
padding: EdgeInsets.all(0),
height: 50,
width: 300,
color: Colors.white,
child: Icon(Icons.home,
size: 40, color: Color.fromRGBO(114, 114, 114, 1)),
),
That space is reserved by the BottomNavigationBarItem
text so you must set selectedFontSize
to 0 in the BottomNavigationBar
.该空间由BottomNavigationBarItem
文本保留,因此您必须在BottomNavigationBar
中将selectedFontSize
设置为 0 。
you can remove the default padding and margin of a selected item in a bottom navigation bar by wrapping the BottomNavigationBarItem in a Container and setting the margin and padding properties to EdgeInsets.zero.您可以通过将 BottomNavigationBarItem 包装在容器中并将边距和填充属性设置为 EdgeInsets.zero 来删除底部导航栏中所选项目的默认填充和边距。
BottomNavigationBar(
items: [
Container(
margin: EdgeInsets.zero,
padding: EdgeInsets.zero,
child: BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
),
),
// other items...
],
// other properties...
),
It's also possible to customize the selected item style by using BottomNavigationBarType.shifting and BottomNavigationBarType.fixed and set the selectedItemColor and unselectedItemColor properties.还可以通过使用 BottomNavigationBarType.shifting 和 BottomNavigationBarType.fixed 自定义所选项目样式,并设置 selectedItemColor 和 unselectedItemColor 属性。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.