const RNTabNavMaterialTab = () => {
return (
<NavigationContainer>
<Tab.Navigator
screenOptions={({route}) => ({
tabBarActiveTintColor: "#f0f",
tabBarInactiveTintColor: "#555",
tabBarActiveBackgroundColor: "#fff",
tabBarInactiveBackgroundColor: "#999",
tabBarShowLabel: true,
tabBarLabelStyle: {"fontSize": 14},
tabBarStyle: [{"display": "flex"},null],
tabBarIcon: ({focused, size, color}) => {
let iconName;
if (route.name === 'Screen_A') {
iconName = 'autoprefixer';
size = focused ? 25 : 20;
// color = focused ? '#f0f' : '#555';
} else if (route.name === 'Screen_B') {
iconName = 'btc';
size = focused ? 25 : 20;
// color = focused ? '#f0f' : '#555';
}
return <FontAwesome5 name={iconName} size={size} color={color} />;
},
})}>
<Tab.Screen
name="Screen_A"
component={ScreenA}
options={{headerShown: false}}
/>
<Tab.Screen
name="Screen_B"
component={ScreenB}
options={{headerShown: false}}
/>
</Tab.Navigator>
</NavigationContainer>
);
};