如何从底部导航栏中删除图标？答案

【问题标题】：How to remove icons from the BottomNavigationBar?如何从底部导航栏中删除图标？
【发布时间】：2020-02-05 15:51:35
【问题描述】：

我只需要 BottomNavigationBarItem 中的标签，但我找不到删除它们的方法。
您可以将 showSelectedLabels 和 showUnselectedLabels 设置为 false 的标签隐藏，但图标没有等效项。

构造函数：

BottomNavigationBar({
    Key key,
    @required this.items,
    this.onTap,
    this.currentIndex = 0,
    this.elevation = 8.0,
    BottomNavigationBarType type,
    Color fixedColor,
    this.backgroundColor,
    this.iconSize = 24.0,
    Color selectedItemColor,
    this.unselectedItemColor,
    this.selectedIconTheme = const IconThemeData(),
    this.unselectedIconTheme = const IconThemeData(),
    this.selectedFontSize = 14.0,
    this.unselectedFontSize = 12.0,
    this.selectedLabelStyle,
    this.unselectedLabelStyle,
    this.showSelectedLabels = true,
    bool showUnselectedLabels,
  })

【问题讨论】：

标签： flutter flutter-layout bottomnavigationview

【解决方案1】：

这个问题的关键是看个人BottomNavigationBarItem()。

如果您插入一个高度为 0.0 的 Container 作为标题，您将获得图标或 activeIcon 项目的所有垂直空间。而且由于BottomNavigationBarItem 接受任何小部件 作为图标或activeIcon，您几乎可以随意使用任何您想要的东西。

在你的情况下可能只是一个像这样的Text() 小部件：

BottomNavigationBarItem(
  icon: Text("My Item"),
  activeIcon: Text("My Item"),
  title: Container(
    height: 0.0,
  ),
)

【讨论】：

你的权利！感觉有点“hacky”，但如果有效，它就有效。
也只是使用此实现来隐藏图标并将其更改为居中的 FloatingActionButton，它真的感觉很hacky，我可能有一天会尝试找到更好的解决方案，但现在它就像一个魅力。谢谢！
这是一个可靠的答案，我已经使用它取得了巨大的成功，但新的答案不那么老套，需要更少的脑力劳动才能理解，所以我将其更改为正确的答案。

【解决方案2】：

我认为更好的方法是配置 BottomNavigationBar。只需添加这一行，它就会正常工作。无需为每个项目添加行

    selectedIconTheme: IconThemeData(opacity: 0.0, size: 0),
    unselectedIconTheme: IconThemeData(opacity: 0.0, size: 0),

例如

bottomNavigationBar: BottomNavigationBar(
    items: const <BottomNavigationBarItem>[
      BottomNavigationBarItem(
        icon: Icon(Icons.home),
        label: 'Home',
      ),
      BottomNavigationBarItem(
        icon: Icon(Icons.business),
        label: 'Business',
      ),
    ],
    currentIndex: _selectedIndex,
    selectedIconTheme: IconThemeData(opacity: 0.0, size: 0),
    unselectedIconTheme: IconThemeData(opacity: 0.0, size: 0),
    selectedItemColor: Colors.amber[800],
    onTap: _onItemTapped,

【讨论】：

这看起来像是另一种可靠的方法。可能比当前选择的答案更直接，所以我将其改为此。