React Native:只允许某个屏幕改变方向 [英] React Native: Allow only a certain screen to change orientation

问题描述

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

I was wondering if it is possible to lock all screens on iOS and Android, except for one screen. I have a video player that I want to show in full screen after rotation, but all other screens need to be the only portrait.

为此我使用 react-native-video.

I use react-native-video for this.

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

I manage to get it rotating when using the samples but I need to set the possible orientations in XCODE and Android studio.

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

I also tried react-native-orientation and put a .lockToPortrait() on it but after tilting, it changes again.

感谢任何帮助

推荐答案

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

I've been through something similar. I want to lock only one screen to landscape. I've tested both react-native-orientation and react-native-orientation-locker. Neither of them worked as expected. It locks for the first time, but after going back and forth to the locked landscape screen, it slips to portrait.

但是，我设法注册了 addOrientationListener 以进行双重检查并强制它始终保持横向.请参阅下面的代码.

However, I managed to register for an addOrientationListener to make a double check and force it to always stay in landscape. See code bellow.

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

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

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

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

Even if it slips to portrait, it goes back to landscape.

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

Maybe you could create a Superclass with the above behaviour and make every screen extend it, expect for that one.

这篇关于React Native:只允许某个屏幕改变方向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！