react native 设置屏幕锁定

前方路远2024-05-13 4:03

原生配置

android 在android/app/src/main/AndroidManifest.xml在这个文件里的入口activity里添加

android:screenOrientation="portrait"

java 复制代码

 <activity
        android:name=".MainActivity"
        android:label="@string/app_name"                               android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize"
        android:screenOrientation="portrait"
        android:exported="true"
>

iOS在AppDelegate.mm文件里加上一下代码

objectivec 复制代码

- (void)setOrientationLock {
    // 设置竖屏锁定
    [[UIDevice currentDevice] setValue:@(UIInterfaceOrientationPortrait) forKey:@"orientation"];
}

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

第三方包

react-native-orientation-locker

先按照文档里配置，以下是用法示例：

javascript 复制代码

  componentWillMount() {
    //横屏
    Orientation.lockToLandscape();
  }
  componentWillUnmount() {
    //页面销毁后恢复竖屏
    Orientation.lockToPortrait();
  }

具体用法可以去文档去查。