How to change background color of bottomnavigationItem?

Viewed 116

I tried following code but it does not working

BottomNavigationBarItem(
            icon: SvgPicture.asset("assets/icons/tinpay3.svg"),
            label: "TINPAY",
            backgroundColor: Color.fromRGBO(255, 194, 44, 1.0),
           )

I want to change background color like that. enter image description here. SO How to change background color of bottomnavigationItem?

1 Answers

BottomNavigationBar has these color arguments:

fixedColor: ...,
backgroundColor: ...,
selectedItemColor: ...,
unselectedItemColor: ...,

and BottomNavigationBarItem has:

backgroundColor: ...,

Maybe you should use them?

UPDATED

I think you can use activeIcon parameter and set it to another image:

BottomNavigationBarItem(
  icon: SvgPicture.asset("assets/icons/tinpay3.svg"),
  activeIcon: SvgPicture.asset("assets/icons/tinpay3_reversed.svg"),
  label: "TINPAY",
  backgroundColor: Color.fromRGBO(255, 194, 44, 1.0),
),

where tinpay3_reversed.svg is the reverse of tinpay3.svg with white letters and colored background.

Related