css - react-navigation-material-bottom-tabs の tabBarLabel と Icon の配置の問題

Question

プロジェクトの 1 つで、React Navigation の createMaterialBottomTabNavigator を使用しています。tabBarIcon と tabBarLabel を一緒に使用すると、アイコンがテキストと重なって表示されます。問題を解決するには助けが必要です。これが私が試したことです-

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,
});