尽管使用了react-native-orientation并在Xcode中设置了项目设置，但React Native应用程序并未锁定为纵向模式

Question

我正在开发一个 React Native 应用程序，并且希望仅将设备方向锁定为纵向模式。我已经安装了react-native-orientation并在我的应用程序中使用它，但它似乎并没有阻止应用程序旋转到横向模式。

这就是我在我的应用程序中使用它的方式：

import Orientation from 'react-native-orientation';

const App = () => {
  useEffect(() => {
    Orientation.lockToPortrait();
  }, []);

  // ...
};

此外，我已将 Xcode 中的设备方向设置为仅纵向，但问题仍然存在。

我已经按照文档中的描述安装并链接了react-native-orientation。 在我的主 App.tsx 组件中，我在 useEffect 挂钩内使用了 Orientation.lockToPortrait() 。 我进入 Xcode 并仅检查了项目常规设置中“设备方向”下的“纵向”选项。它没有做任何事情，所以我手动更改了 info.plist 以包含

    <array>
        <string>UIInterfaceOrientationPortrait</string>
    </array>
    <key>UISupportedInterfaceOrientations~ipad</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
    </array>

我以前用过很多次Xcode方法都没有问题，但这次不行。是否有已知的软件包可以覆盖它？

我正在使用 Xcode

14.3.1

并做出原生反应

0.71.12

任何帮助将不胜感激。

Answer 1

通过在我的 AppDelegate.mm 末尾添加此内容来修复它

- (UIInterfaceOrientationMask)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window
{
  return UIInterfaceOrientationMaskPortrait;
}

Answer 2

您可以使用名为react-native-expo-device-orientation的包。 expo 和 bare React Native 应用程序都支持它。它使用加速度计来计算尺寸。基本上使用这个包，您可以更改应用程序屏幕的元素，而无需旋转应用程序屏幕。

react-native-expo-device-orientation