2

I'm using SVG images in my BottomNavigationBar, but when I set selectedItemColor and unselectedItemColor doesn't work.

I'm trying using icons from Flutter framework and It's work. The problem is with SVG images.

I can manage the state for item selected, but I want to know if there is a clean solution using SVG images in my BottomNavigationBar.

I'm using flutter_svg_provider packages for use SVG images in my app.

bottomNavigationBar: BottomNavigationBar(
    type: BottomNavigationBarType.fixed,
    backgroundColor: const Color.fromRGBO(
      27,
      58,
      44,
      1,
    ),
    items: <BottomNavigationBarItem>[
      BottomNavigationBarItem(
        icon: Image(
          width: 30,
          height: 30,
          image: const Svg('assets/home.svg'),
          color: _selectedIndex == 0
              ? Colors.white
              : const Color.fromRGBO(
                  131,
                  247,
                  126,
                  1,
                ),
        ),
        label: 'Home',
      ),         
      BottomNavigationBarItem(
        icon: Image(
          width: 30,
          height: 30,
          image: const Svg('assets/notifications.svg'),
          color: _selectedIndex == 1
              ? Colors.white
              : const Color.fromRGBO(
                  131,
                  247,
                  126,
                  1,
                ),
        ),
        label: 'Notifications',
      ),
    ],
    showSelectedLabels: false,
    showUnselectedLabels: false,
    currentIndex: _selectedIndex,
    unselectedItemColor: const Color.fromRGBO(
      131,
      247,
      126,
      1,
    ),
    selectedItemColor: Colors.white,
    onTap: _onItemTapped,
  ),
rubone
  • 53
  • 6

0 Answers0