我对 Flutter (0.6) 中的 BottomNavigationBar 有问题。一旦我将 三个以上的 BottomNavigationBarItems 添加为子项，栏中的按钮就会有 白色图标，而且它们会被弄乱。当我只使用三个或更少的项目时，一切都很好。

这是我使用的小部件代码，它打破了条形:

bottomNavigationBar: BottomNavigationBar(
          currentIndex: 0,
          iconSize: 20.0,
          items: [
          BottomNavigationBarItem(
              title: Text('Home'), icon: Icon(Icons.accessibility)),
          BottomNavigationBarItem(
              title: Text('Preise'), icon: Icon(Icons.account_box)),
          BottomNavigationBarItem(
              title: Text('Test'), icon: Icon(Icons.adb)),
          BottomNavigationBarItem(
              title: Text('Mehr'), icon: Icon(Icons.menu))
        ])

有人知道这里出了什么问题吗？

提前感谢您的任何提示， 迈克尔

最佳答案

对于 4 个或更多项目，将 type 设置为固定。

bottomNavigationBar: BottomNavigationBar(
  type: BottomNavigationBarType.fixed, // This is all you need!
  items: // ...,
)

来自 https://github.com/flutter/flutter/issues/13642#issuecomment-371875044

When more than 3 BottomNavigationBar items are provided the type, if unspecified, changes to BottomNavigationBarType.shifting per https://docs.flutter.io/flutter/material/BottomNavigationBar/BottomNavigationBar.html. This bit of information should be highlighted in the class's doc. It's easy to overlook where it is (I overlooked it).

When the BottomNavigationBar's type is BottomNavigationBarType.shifting the items text and icons are rendered in white, via DefaultTextStyle and IconTheme. It's assumed that theirBottomNavigationBarItem.backgroundColor will be specified as a contrasting color. This is obviously confusing.

The overall idea with shifting type bottom navigation bars is that each item will have a different background color (that contrasts with white), since that color will become the color of the entire navigation bar, when the item is selected.

The doc for BottomNavigationBar, and NavigationBarItem needs to be improved.

https://stackoverflow.com/questions/52199196/