title: How to customize the bottom bar in react native?
body: <p>I am using a bottom bar in react native. How do I change the background color and make the active bar highlighted with a line at bottom as shown in the image?</p>
  
  <p>Code -</p>
  
  <pre><code>export const InternalStacks = TabNavigator({
      Home: { screen: HomeStack },    
      Graph: { screen: GraphStack }
  },{
      navigationOptions: ({ navigation }) =&gt; ({
        tabBarIcon: ({ focused, tintColor }) =&gt; {
              const { routeName } = navigation.state;
              switch(routeName){
                  case 'Home':
                      iconName = require('../assets/icons/home.png');
                      iconNameFocused = require('../assets/icons/home.png');
                      break;
                  case 'Graph':
                      iconName = require('../assets/icons/chart.png');
                      iconNameFocused = require('../assets/icons/chart.png');
                      break;
              }
              if(focused)
              return ( &lt;Image style={{width: 20, height: 20, tintColor }} source={iconNameFocused} /&gt; );
              else
              return ( &lt;Image style={{width: 20, height: 20, tintColor }} source={iconName} /&gt; );
          }
      }),
      tabBarComponent: TabBarBottom,
      tabBarPosition: 'bottom',
      tabBarOptions: {
        activeTintColor: '#FBC530',
        inactiveTintColor: 'black',
      },
      animationEnabled: false,
      swipeEnabled: false,
    });
  </code></pre>
  
  <p>Current design -
  <a href="https://i.stack.imgur.com/9vvl6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9vvl6.png" alt="Current Design"></a></p>
  
  <p>Required Design -
  <a href="https://i.stack.imgur.com/dwJms.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/dwJms.png" alt="Required Design"></a></p>
  
  <p><br>
  Tried with the below,</p>
  
  <pre><code>tabBarColor: '#E64A19',
  backgroundColor: 'white',
  </code></pre>
  
  <p>but none of the worked. What is the better way to achieve the required design?</p>
  
  <p>PS - Not worried about the icons.</p>