【问题标题】:How to dynamically set orientation of pushed screen - React-Native-Navigation如何动态设置推送屏幕的方向 - React-Native-Navigation
【发布时间】:2026-01-27 09:30:01
【问题描述】:

我想知道如何使用 react-native-navigation 动态更改推送屏幕的方向。

我正在使用 startSingleScreenApp 和 appStyle 的方向:'portrait' 来强制竖屏。我只想让其中一个推送的屏幕使用“自动”

我尝试了以下方法:

static navigatorStyle = {
   drawUnderTabBar: true,
   orientation: 'auto'
};

我也试过了:

componentWillMount() {
   this.props.navigator.setStyle({
      orientation: 'auto'
   });
};

我什至使用:

...
navigatorStyle: {
  orientation:'auto'
}
...

甚至可以动态改变它吗?

【问题讨论】:

    标签: react-native react-native-navigation


    【解决方案1】:

    可以通过使用“React Native Orientation”来实现。它将监听 React Native 应用程序中的设备方向变化,并以编程方式为每个屏幕设置首选方向。它适用于 Android 和 iOS。详情请见以下链接:

    https://github.com/yamill/react-native-orientation
    

    您可以按如下方式使用它:

    import Orientation from 'react-native-orientation';
    
    // this locks the view to Portrait Mode. Need to add this in your screens 
     componentDidMount function
    Orientation.lockToPortrait();
    

    或者

    // this locks the view to Landscape Mode. Need to add this in your screens 
     componentDidMount function
     Orientation.lockToLandscape();
    

    您可以在共享链接中找到详细说明/指南。您可以根据需要相应地添加逻辑。希望对你有帮助。

    【讨论】:

    • 我用了这个方案,但是从竖屏到横屏的过渡不流畅,有点卡顿,应该怎么做才是正确的?