flutterdartbottom-navigation-bar

BottomNavBarItem label not displayed when unselected


  @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.

The icons are showing up regardless of selected or unselected.

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


Solution

  • 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.