React Native 底部选项卡导航器太低并在 iphone 14 pro（真实设备）、expo 46.0.0 的底部被切断

Question

我正在使用 react-navigation-tabs 中的 createBottomTabNavigator 开发一个带有 expo 的本机应用程序（react-navigation-tabs 版本：^2.4.0，react-navigation 版本 ^4.4.4）。当我在任何 ios 模拟器（iphone 13、iphone 14 pro、iphone 14 max...使用 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 pro 上的显示方式与在模拟 iphone 14 pro 上的显示方式不同，理想情况下如何在真实设备上解决此问题？任何帮助表示赞赏。

我试过的东西：

• 在不同的模拟器设备（iphone 13、iphone 14 pro、iphone 14 max ...）上运行应用程序 -> 底部选项卡导航器正确显示
• 在真正的 iphone 11 pro 上运行应用程序 -> 底部标签导航器正确显示
• 在真正的 iphone 14 pro 上运行应用程序 -> 底部标签导航器被切断
• 在选项卡栏选项中手动增加底部选项卡导航器的边距（有效，但不是一个好的解决方案，因为这因设备而异，例如边距对于 iphone 11 pro 来说太大了...）
• 在 expo 版本 44.0.0 上，相同的应用程序曾经工作并且选项卡导航器正确显示，在升级到 expo 46.0.0 后，出现了所描述的问题

Answer 1

尝试使用

safeAreaInsets 

tabBarOptions: {
      activeTintColor: colors.primaryColor,
      safeAreaInsets: {
        bottom: 0,
      },
    },