我正在使用react-navigation-tabs中的createBottomTabNavigator(react-navigation-tabs版本:^2.4.0,react-navigation version ^4.4.4).当我在任何iOS模拟器上运行我的应用程序(iPhone 13,iPhone 14 pro,iPhone 14 max... with ios 16.2)底部标签导航器正确显示.然而,在真实的设备上(iPhone 14 pro,ios 16.3)标签栏被移动到底部约20像素并被切断:
当我定义标签导航器时,我不改变任何边距,填充或高度属性,而是坚持默认值,我唯一改变的是色调颜色:
import React from "react";
import { createStackNavigator } from "react-navigation-stack";
import { createDrawerNavigator } from "react-navigation-drawer";
import { createBottomTabNavigator } from "react-navigation-tabs";
import { createAppContainer, createSwitchNavigator } from "react-navigation";
import { Ionicons } from "@expo/vector-icons";
...
const MainTabNavigator = createBottomTabNavigator(
{
Home: {
screen: HomeNavigator,
navigationOptions: {
tabBarLabel: "Home",
showLabel: false,
tabBarIcon: tabInfo => {
return (
<Ionicons
name={icons.home}
size={25}
color={tabInfo.tintColor}
/>
);
},
},
},
Map: {...},
Workouts: {...},
Events: {...},
Profile: {...},
},
{
tabBarOptions: {
activeTintColor: colors.primaryColor,
},
}
);
const MainNavigator = createSwitchNavigator({
Startup: StartupScreen,
Auth: AuthNavigator,
ProfileCreation: ProfileCreationFlowScreen,
ForgotPassword: ForgotPasswordScreen,
Main: MainTabNavigator,
});
export default createAppContainer(MainNavigator);
有没有人知道为什么标签栏显示不同的真实的iPhone 14亲比模拟iPhone 14亲和理想的如何解决这个问题的真实设备?任何帮助是赞赏.
我试过的东西:
- 在不同的模拟器设备上运行应用程序(iPhone13,iPhone14 Pro,iPhone14 Max...)-〉底部标签导航器正确显示
- 在真实的的iPhone11 Pro上运行应用程序-〉底部标签导航器显示正确
- 在真实的的iPhone14 Pro上运行应用程序-〉底部标签导航器被切断
- 在标签栏选项中手动增加底部标签导航器的边距(这是有效的,但不是一个好的解决方案,因为这对每个设备都不同,例如,对于iphone11 pro来说,边距太大了……)
- 在expo版本44.0.0上,相同的应用程序可以正常工作,标签导航器显示正确,升级到expo 46.0.0后,出现了所述问题
1条答案
按热度按时间shyt4zoc1#
尝试使用
safeAreaInsets
或者