Change bottom bar selected icon color dynamically on react-native-navigation

Viewed 783

I'm using Wix's react-native-navigation (v1) and I wanted to change the selected state color depending on the current tab selected.

Now, there's a way to change it globally through tabBarSelectedButtonColor but I was wondering if there could be a chance of updating this variable color depending on the screen the user is in. i.e: Home will be green when selected, Tab2 will be blue and Tab3 will be red.

Creating the navigation like this:

Navigation.startTabBasedApp({
   tabs: [
     {
       screen: 'screenName',
       label: 'Home',
       icon: iconsMap['md-home'],
       navigatorStyle: {
           navBarHidden: true
       },
       // this applies for other screens ofc
   ],
   tabsStyle: {
      forceTitlesDisplay: true,
      tabBarTextFontFamily: 'fontname',
      tabBarSelectedButtonColor: 'red'
   },
   appStyle: {
      tabBarSelectedButtonColor: 'red'
   }
});

Do you guys know a way to update it? or is there any callback function when the tab was pressed? So I could manually update it through there?

Thanks.

0 Answers
Related