如何让React Native应用在iOS和Android仅以竖屏启动？现有方案失效

你说得对，JS代码是在应用初始化完成后才执行的，所以启动阶段的屏幕方向必须通过原生配置来控制，以下是iOS和Android的具体配置步骤：

iOS 端配置 #

方法1：Xcode可视化设置 #

1. 打开项目的Xcode工程，选中目标项目
2. 切换到「General」标签页，找到「Deployment Info」区域
3. 在「Device Orientation」下仅勾选「Portrait」（取消其他方向的勾选）
4. 若适配iPad，同样在iPad的「Device Orientation」里只保留「Portrait」

方法2：修改Info.plist文件 #

直接编辑项目根目录下的ios/[项目名]/Info.plist，调整UISupportedInterfaceOrientations和UISupportedInterfaceOrientations~ipad（适配iPad时）的配置，仅保留竖屏项：

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

方法3：AppDelegate.mm强制设置 #

如果需要更灵活的全局控制，可在ios/[项目名]/AppDelegate.mm中添加代码：

#import "Orientation.h"

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  // 保留原有初始化代码
  
  // 启动时强制锁定竖屏
  [[Orientation sharedInstance] lockToPortrait];
  
  return YES;
}

// 重写方法全局限制方向
- (UIInterfaceOrientationMask)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window {
  return UIInterfaceOrientationMaskPortrait;
}

Android 端配置 #

修改AndroidManifest.xml #

打开android/app/src/main/AndroidManifest.xml，在主Activity标签中添加android:screenOrientation="portrait"属性：

<activity
  android:name=".MainActivity"
  android:screenOrientation="portrait"
  android:exported="true"
  android:launchMode="singleTask"
  android:windowSoftInputMode="adjustResize">
  <!-- 保留原有配置 -->
</activity>

额外说明 #

后续如果需要在JS代码中动态切换方向，你原有的Orientation.lockToPortrait()代码依然有效，但启动阶段的方向已由原生配置锁定，不会出现启动时横屏的情况。

最后检查 #

1. 执行npx react-native run-ios或npx react-native run-android重新打包应用（原生配置修改后必须重启应用才能生效）
2. 确认react-native-orientation-locker已正确安装链接（RN 0.60+版本会自动链接，无需手动操作）

内容的提问来源于stack exchange，提问作者tharwi