在颤动中选择时，BottomNavigationBarItem 标签不显示

Question

代码是：

 BottomNavigationBar(
  selectedLabelStyle: TextStyles.labelSelectedTextStyle,
  unselectedLabelStyle: TextStyles.labelUnSelectedTextStyle,)

为导航项目添加了两种不同的样式，但选择时项目标签未显示。

Answer 1

也许现在有人会面临同样的问题。目前，BottomNavigationBar 类具有属性 showUnselectedLabels ，默认情况下等于 false 。因此，要使 BottomNavigationBarItem 中的标签显示，您需要设置以下属性：

showUnselectedLabels: true,

Answer 2

为此，请单独添加颜色，如下所示：

  selectedLabelStyle: TextStyles.labelSelectedTextStyle,
  unselectedLabelStyle: TextStyles.labelUnSelectedTextStyle,
  selectedItemColor:  Colors.blue,
  unselectedItemColor:  Colors.red,

Answer 3

使用下面的简单解决方案来更改 selectedLabelStyle 和 unselectedLabelStyle -（标签文本的颜色）：

      child: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        backgroundColor: appWhiteColor,
        elevation: 1,
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            activeIcon: Image.asset(
              "assets/images/race_icon_fill.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.amber,
            ),
            icon: Image.asset(
              "assets/images/race_icon.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.grey,
            ),
            label: 'My Races',
          ),
          BottomNavigationBarItem(
            activeIcon: Image.asset(
              "assets/images/horse_icon_fill.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.amber,
            ),
            icon: Image.asset(
              "assets/images/horse_icon.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.grey,
            ),
            label: 'My Horses',
          ),
          BottomNavigationBarItem(
            activeIcon: Image.asset(
              "assets/images/remainder_icon_fill.png",
              height: 30,
              width: 30,
              color: Colors.amber,
              fit: BoxFit.cover,
            ),
            icon: Image.asset(
              "assets/images/remainder_icon.png",
              height: 30,
              width: 30,
              color: Colors.grey,
              fit: BoxFit.cover,
            ),
            label: 'My Reminders',
          ),
          BottomNavigationBarItem(
            activeIcon: Image.asset(
              "assets/images/profile_icon_fill.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.amber,
            ),
            icon: Image.asset(
              "assets/images/profile_icon.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: Colors.grey,
            ),
            label: 'My Profile',
          ),
        ],
        currentIndex: _selectedIndex,
        selectedItemColor: Colors.black,
        unselectedItemColor: Colors.deepPurple,
        selectedLabelStyle: const TextStyle(
            fontWeight: FontWeight.w500, fontFamily: "AlbertSans"),
        unselectedLabelStyle: const TextStyle(
            fontWeight: FontWeight.w300, fontFamily: "AlbertSans"),
        onTap: _onItemTapped,
      ),

要点：

          BottomNavigationBarItem(
            activeIcon: Image.asset(
              "assets/images/race_icon_fill.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: appThemeColor,
            ),
            icon: Image.asset(
              "assets/images/race_icon.png",
              height: 30,
              width: 30,
              fit: BoxFit.cover,
              color: appLightGrayColor,
            ),
            label: 'My Races',
          ),

==========================================

            selectedItemColor: Colors.black,
            unselectedItemColor: Colors.grey,
            selectedLabelStyle: const TextStyle(
                fontWeight: FontWeight.w500, fontFamily: AlbertSans),
            unselectedLabelStyle: const TextStyle(
                fontWeight: FontWeight.w300, fontFamily: AlbertSans, color: Colors.deepPurple),