react native createbottomtabnavigator hide tab bar label
The above answer is perfect, But it messed the brackets a bit. So for a new bee like me, Here is the proper code.
const ProfileStack = createStackNavigator({
Profile: SettingsScreen
});
ProfileStack.navigationOptions = {
tabBarIcon: ({ focused }) => (
<TabBarIcon
focused={focused}
title={'Profile'}
name={focused ? 'tabIcon' : 'tabIconFocused'}
/>
),
tabBarOptions: { showLabel: false }
};
On the new versions of React Navigation, you just need to pass showLabel
prop as false
<Tab.Navigator tabBarOptions={{ showLabel: false }}>
You have to define showLabel: false
as the docs says, just as
const Tabs = createBottomTabNavigator ({
Home:{
screen: Home,
navigationOptions:{
tabBarIcon: ({ focused, tintcolor }) => (
<Icon name="ios-home" size={24} />
)
}
},
...
,
Settings:{screen: Settings,
navigationOptions:{
tabBarIcon: ({ tintcolor }) => (
<Icon name="ios-settings" size={24} />
)
}
}
}
}, {
tabBarOptions: { showLabel: false }
});