Closed jungleyu closed 5 years ago
That is how this library works. If you want something besides the default, you would need to create a custom renderLabel
method and pass that in. In order to help determine which label is active, I just submitted this PR (for a different issue) but it should help on this issue too: https://github.com/react-native-community/react-native-tab-view/pull/589
Would be really helpfull if you can add these in a prop like
<TabBar
...
activeColor={'Your color'}
inactiveColor={'custom color'}
inactiveOpacity={0.5}
activeOpacity={1.0}
/>
@t3chnoboy I think we can solve this in #589 - I am engaging with @satya164 to ensure that the approach is to his liking so that it can be merged when complete. Please jump on that thread if you have input.
@DaKaZ Hope it will be released in the next update soon!
Hey, I just released a new alpha 2.0.0-alpha.0
of the library. It's rewritten using react-native-gesture-handler and react-native-reanimated addresses a many platform specific bugs and performance problems. The documentation is updated as well.
Please try the new version and see if it addresses your issue. If not, please open a new issue following the issue template.
Hello guys the activeColor and inactiveColor props are not working for me. I am trying to us this for the label text. Please advise.
RN version = 0.59.10 RN Tab View version = 2.10.0
what could be the issue ?
Same issue as @Base29.
<TabBar inactiveColor='green' />
does have no effect.
react-native-tab-view@2.10.0 react-native > expo v34
this still appears to be an issue.
UPDATE: Seems it does work, you just need to make sure you don't have a color set in labelStyle={{}} as that will take priority. Hope this helps.
<TabBar {...props} indicatorStyle={{ backgroundColor: '#007AFF' }} style={{ backgroundColor: '#ffffff'}} renderLabel={({ route, focused, color }) => { if(focused) return( <Text style={[{ color : '#007AFF'}, styles.TabViewBarItemText]}> {route.title} ) else return(
)
}}
/>
Have solved problem by customize TabBar code
Currently I can just set label color, when I change the tab, it just change the opacity. But what can I do if I want to set different label color for active and inactive label. What I do now is just using renderLabel to decide active label and inactive label style.