''tabBarActiveBackgroundColor' not working in 'react-native material top tabs'
I'm using React navigation 6
import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';
const renderCourses = () => {
const Tab = createMaterialTopTabNavigator();
return (
<View style={{paddingTop: 20, flex: 1}}>
<Tab.Navigator
screenOptions={({route}) => ({
tabBarStyle: {
width: '65%',
},
tabBarLabelStyle: {
fontFamily: fonts.proximaNovaMedium,
fontSize: 12,
fontWeight: '500',
letterSpacing: 0,
lineHeight: 15,
textAlign: 'center',
},
tabBarActiveTintColor: colors.phoneNumberActive,
tabBarIndicatorStyle: {
backgroundColor: null,
},
})}>
<Tab.Screen
name="Ongoing"
component={OngoingScreen}
options={{
tabBarLabel: 'Ongoing',
tabBarActiveBackgroundColor: 'green',
}}
/>
<Tab.Screen name="Completed" component={CompletedScreen} />
</Tab.Navigator>
</View>
);
};
I want to change the active tab background color but tabBarActiveBackgroundColor is not working. And I have to change the label to title case it's setting to uppercase by default I cannot change that. How to do this?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
