我的标签导航栏在模拟器上看起来很正常,在手机上看起来很宽

问题描述

当我在博览会上测试我的应用程序时,它看起来不错,但是当我在手机上使用它时,它变得太宽了,希望将菜单栏设置为适用于android和ios的标准尺寸,我已经尝试了一些事情,但到目前为止我还没有解决办法,谢谢

  return(
    
    <Tab.Navigator
    screenoptions={({ route }) => ({
      tabBarIcon: ({ color,size }) => {
        let iconName;

        if (route.name === 'Home') {
          iconName = 'md-home'; size=30;
        } else if (route.name === 'User') {
          iconName = 'md-person'; size=30;
        }
          else if (route.name === 'Notifications') {
          iconName = 'md-notifications'; size=30;
        }
          else if (route.name === 'Chat') {
          iconName = 'md-chatbubbles'; size=30;
        }

        // You can return any component that you like here!
        return <Ionicons name={iconName} size={size} color={color} />;
      },})}
    tabBarOptions={{
      style: {
        backgroundColor: '#45108A'
      },showLabel: false,activeTintColor: '#fff',inactiveTintColor: Colors.grey400,}}>

      
      <Tab.Screen name='Home' component={Home} />
      <Tab.Screen name='User' component={User} />
      <Tab.Screen name='Notifications' component={Notifications} />
      <Tab.Screen name='Chat' component={Chat} />
    </Tab.Navigator>
  )
}

const Tab = createBottomTabNavigator();

export default function App (){
  return (    
    <NavigationContainer>
      <Tabs />
    </NavigationContainer>
  );
  
} ```


here's an image to help you understand the problem.

  [1]: https://i.stack.imgur.com/TpHVR.jpg

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)