Cannot style bottom border of active tab

[Twinbird24]

Version

• react-native-router-flux v4.0.0-beta.26

Expected behaviour

To be able to change the style of the actively selected tab's bottom border.

Actual behaviour

There does not appear to be a prop to change the actively selected tab's bottom border (see screen shot, the border of that active tab is yellow–I cannot change it). Setting the style in the tabStyle prop doesn't change the expected behaviour, i.e. tabStyle={{ borderBottomWidth: 1, borderBottomColor: 'blue' }} doesn't effect the color of the selected tab's bottom border.

Steps to reproduce

I have my code structured like so:

<Tabs
  key="tabsContainer"
  showLabel={true}
  tabBarPosition='top'
  title="Tabs Container"
  wrap={false}
  back
  lazy
  activeBackgroundColor="red"
  tabBarStyle={{ backgroundColor: 'white' }}
  activeTintColor="black"
  inactiveTintColor="black"
>
  <Scene
    key="key"
    component={myComponent}
    onEnter={trackPage}
    title="Tab 1"
    onLeft={() => { Actions.pop(); }}
  />
  <Scene
    key="key2"
    component={myComponent}
    onEnter={trackPage}
    title="Tab 2"
    onLeft={() => { Actions.pop(); }}
  />
  <Scene
    key="key3"
    component={myComponent}
    onEnter={trackPage}
    title="Tab 3"
    onLeft={() => { Actions.pop(); }}
  />
</Tabs>

[Maple13]

I also encountered this problem, is there a solution? My version is 4.0.0-beta.31

[Maple13]

@Twinbird24 Hey! You can look at #504, Use indicatorStyle can cover underscore

[aksonov]

Closing it (indicatorStyle should be used)