React Native：只允许某个屏幕改变方向答案

【问题标题】：React Native: Allow only a certain screen to change orientationReact Native：只允许某个屏幕改变方向
【发布时间】：2019-02-15 18:22:00
【问题描述】：

我想知道是否可以锁定 iOS 和 Android 上的所有屏幕，除了一个屏幕。我有一个视频播放器，我想在旋转后全屏显示，但所有其他屏幕都必须是唯一的纵向。

我为此使用 react-native-video。

我在使用示例时设法让它旋转，但我需要在 XCODE 和 Android Studio 中设置可能的方向。

我也尝试过 react-native-orientation 并在其上放了一个 .lockToPortrait() 但倾斜后，它又改变了。

感谢任何帮助

【问题讨论】：

添加一些你用来尝试锁定屏幕方向的代码
如果有人搜索此link 可能会有所帮助

标签： react-native video

【解决方案1】：

const {navigation} = props

useEffect(() => {
    navigation.addListener("focus", () => {
      ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.DEFAULT);
    });

    navigation.addListener("blur", () => {
      ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.PORTRAIT);
    });
  }, [navigation]);

focus 事件在我们想要允许屏幕旋转的屏幕时触发，blur 事件在用户离开包含此代码的屏幕时触发，然后被限制为 PORTRAIT（在这种情况下）。

【讨论】：

这适用于功能组件，expo，您也可以使用const navigation = useNavigation();
如果这是一个更好的答案，那么请接受并投票赞成这个答案。
@Abhishek ScreenOrientation 来自react-native-orientation 包？
@AlineMatos 它来自 expo-screen-orientation。
这个 sn-p 仅适用于 expo 或 expo 裸工作流，尽管是一个很好的答案，但 op 使用 react-native-video 的事实使其在这种情况下成为错误的答案，因为没有任何迹象表明他正在使用任何 expo 包。

【解决方案2】：

我也经历过类似的事情。我只想将一个屏幕锁定为横向。我已经测试了react-native-orientation 和react-native-orientation-locker。他们都没有按预期工作。它第一次锁定，但在来回锁定横向屏幕后，它滑到纵向。

但是，我设法注册了addOrientationListener 以进行仔细检查并强制它始终保持在横向状态。请参阅下面的代码。

_onOrientationDidChange = (orientation) => {
  if (orientation == 'PORTRAIT') {
    Orientation.lockToLandscapeLeft();
  }
};

componentDidMount() {
  Orientation.lockToLandscapeLeft();
  Orientation.addOrientationListener(this._onOrientationDidChange);
}

componentWillUnmount() {
  Orientation.unlockAllOrientations()
  Orientation.removeOrientationListener(this._onOrientationDidChange);
}

即使它滑到纵向，它也会回到横向。

也许你可以创建一个具有上述行为的超类，并让每个屏幕都扩展它，期待那个。

【讨论】：

方向似乎已被弃用。我想它不再起作用了。任何更多的帮助将不胜感激。
@vickykeshri 你有没有其他选项来修复 react-native 中某些屏幕的方向？
@Punita 不幸的是没有。我有一种感觉，如果您更本地化，这可能是可能的。我的意思是，如果可以注册本机活动并以某种方式在 js 代码上使用它。