1

I've been unable to find any examples of this or really any questions asking the same thing so I'm not sure yet if its possible. I have a requirement for each icon in my bottom navigation bar to be a different color. So 4 tabs, 4 icons, 4 colors. In the past i've never had to go beyond iconTintList to modify the states as my items shared a selected and deselected color.

Is it possible to set a separate TintList on each of the tab items? Another idea i've had from googling around is to set IconTintList to null, and then have each of my icons have their color in the icon itself. I lose the state control if this works, but I could force it to change icons themselves when they gain or lose focus to the correct colored icon. This seems a little hacky though.

EDIT: I can confirm the solution of setting the TintList to null and using appropriately color icons will work. Hoping I don't have to go this route, but looks like it'll satisfy my requirement if it is the only way.

Thanks

Kyle
  • 1,430
  • 1
  • 11
  • 34

2 Answers2

1

You can use this layout How to combine BottomAppBar + FAB with BottomNavigationView (check the marked answer) then you can easily modify each items as per your requirement.

Shoaib Mirza
  • 153
  • 3
  • 12
  • Will look a bit more into this. Looks like a good example for quite a bit of customization. Thanks – Kyle Apr 09 '19 at 14:40
  • Been to a same situation as you are a weeks ago, this is one of the best and easy solution i find on the internet. – Shoaib Mirza Apr 09 '19 at 15:06
  • It does seem like the best way to handle this is to really customize the entire bottom navigation bar. For anyone who wants a quick but maybe dirtier answer, it does work to set the navigation bar's tint list to null, and then use appropriately colored icons for your tabs. They can each be different colors, and based on state you can swap the icon resource id. – Kyle Apr 16 '19 at 13:31
0

You can create a colorStateList then try:

bottomNavigation.getMenu().getItem(0).setIconTintList(iconsColorStates);

or:

bottomNavigation.getMenu().findItem(R.id.item).setIconTintList(iconsColorStates);

and replicate to each menu item... I think it will work.

Lucas Silva
  • 1
  • 1
  • I did actually give this a try but unfortunately it didn't seem to work. For now the only thing i've been able to get working was to turn the iconTintList to null and use colored icons themselves. – Kyle Apr 09 '19 at 14:39
  • I have not found another solution for this ... maybe it is not even possible. But in any case, this library can help: [link](https://androidexample365.com/helps-users-to-use-bottom-navigation-bar-with-ease-and-allows-ton-of-customizations/) – Lucas Silva Apr 09 '19 at 21:34