Nativebase: scrollable tab bar background color unable to change

[HJ29]

react-native, react and native-base version

react-native 0.55.4
react 16.0.0
native-base 2.4.4

Expected behaviour

able to change scrollable tab's background color

Actual behaviour

unable to change the default color #3f51b5.

Steps to reproduce (code snippet or screenshot)

scrollable tab code

1. tried change material theme.
   
   theme imported.
   
2. tried changing tabStyle backgroundColor on tab

Screenshot of emulator/device

here is the result, the blue color unable to change

Is the bug present in both ios and android or in any one of them?

only tried on android

Any other additional info which would help us debug the issue quicker.

no

[akhil-geekyants]

@HJ29 try setting backgroundColor to ScrollableTab

like

<Tabs renderTabBar={() => <ScrollableTab style={{ backgroundColor: "white" }} />}>

[SupriyaKalghatgi]

@HJ29 Closing this in a day in case of no response

[HJ29]

@akhil-geekyants Thanks for your help! Your answer is correct and clear.

[ravirupareliya]

Or you can use tabBarBackgroundColor property of <Tabs>

<Tabs tabBarBackgroundColor={'#ffffff'}

[egaslan]

@HJ29 you can try this code. 'ScrollableTab' and 'TabHeading ' are important.

<Tabs transparent renderTabBar={()=> <ScrollableTab style={{ backgroundColor: "#ccc" }} />}>                  
    <Tab heading={ 
        <TabHeading style={{ backgroundColor: "#ccc" }}><Icon name="home"/>
            <Text>Home</Text>
        </TabHeading>}>
       <TabOne/>
    </Tab>
</Tabs> 

[anhhtz]

@HJ29 try setting backgroundColor to ScrollableTab

like

<Tabs renderTabBar={() => <ScrollableTab style={{ backgroundColor: "white" }} />}>

You saved my life today :100: