BottomNavBarItem label not displayed when unselected

Question

  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: AppBar(
      title: Text(
        _titles[_currentIndex],
      ),
      backgroundColor: matGreen,
    ),
    body: _pages[_currentIndex],
    bottomNavigationBar: BottomNavigationBar(
      items: <BottomNavigationBarItem> [
        _genNavItem(0, 'a'),
        _genNavItem(1, 'b'),
        _genNavItem(2, 'c'),
        _genNavItem(3, 'd'),
      ],
      onTap: (index) {
        setState(() {
          _currentIndex = index;
        });
      },
      currentIndex: _currentIndex,
    ),
  );

  BottomNavigationBarItem _genNavItem(
    int iconIndex, 
    String title,
  ) => BottomNavigationBarItem(
    icon: Icon(
      _icons[iconIndex],
      size: 35.0, 
    ),
    label: title,
    backgroundColor: matGreen
  );

I have the above code, and the problem where the unselected labels ('a'~'d') in the navbaritems are not being displayed. They only show up in white font when selected. I've tried the following so far, but nothing seems to solve the issue.

• selectedLabelStyle
• unselectedLabelStyle
• SafeArea>>Stack(...)

The icons are showing up regardless of selected or unselected.

Would anyone have any suggestions on what else to try please?

Answer 1

try adding these 3 attributes to this line to see how currentIndex: _currentIndex,

showUnselectedLabels: true,        
unselectedItemColor: Colors.white,
selectedItemColor: Colors.blue,

The type you will set the boolean to true first, when selected, it will change to blue, and when unchecked, it will become white, try it that way.