Unable to change Tab bar background color

Question

I am using BottomTabNavigator in my project I am unable to change the color of the Tab it's being in default color although I am trying to change the style background color. Following is the code I am using, even the tintcolors also not getting changed. I am attaching the screenshots of the page. I want to change the color of the bar where the icons present..

{
      tabBarPosition: 'bottom',
      tabBarOptions: {
               activeTintColor: 'blue',
          inactiveTintColor: 'grey',
          style: {
            backgroundColor: 'darkcerulean',
            },
            labelStyle: {
              fontSize: 13,
          },

      }
}

Can someone help me with that ?

Thanks in advance.

Answer 1

use it example:

 export default createBottomTabNavigator({
      home: {
        screen: HomeScreen,
        navigationOptions: ({ navigation }) => ({ 
          title: 'Home'
        })
       }, 
      }, 
     {
        initialRouteName: "home",
        tabBarOptions: {
          style: {
           height: 55,
           backgroundColor: '#8e7e7e'
          }
        }
     });