Reaction-导航-材质-底部-选项卡中的选项卡栏标签和图标的对齐问题
本文介绍了Reaction-导航-材质-底部-选项卡中的选项卡栏标签和图标的对齐问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在为我的一个项目使用Reaction导航中的createMaterialBottomTabNavigator。如果我将Tab栏图标和Tab栏标签一起使用,图标将与文本重叠。需要帮助来解决该问题。
以下是我尝试过的–
const MainNavigator = createMaterialBottomTabNavigator({
Offers: {
screen: OffersNavigator,
navigationOptions:{
tabBarIcon: (
{focused}) => {
return <IconButton icon="tag" style={{marginBottom: 5}} color={focused ? '#2E98FF' : '#000'} size={20}/>
},
tabBarLabel: 'Offers',
},
},
Search: SearchNavigator,
Settings: SettingsNavigator,
});
推荐答案
边距图标如下。它将完美地发挥作用。
<IconButton icon="tag" style={{marginTop: -3}} color={focused ? '#2E98FF' : '#000'} size={20}/>
这篇关于Reaction-导航-材质-底部-选项卡中的选项卡栏标签和图标的对齐问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,