react native 设置屏幕锁定

前方路远

已于 2024-05-09 10:14:41 修改

阅读量380

点赞数 3

文章标签： react native react.js javascript

于 2024-05-09 10:13:23 首次发布

本文链接：https://blog.csdn.net/weixin_52063276/article/details/138602749

版权

原生配置

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

android:screenOrientation="portrait"

 <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文件里加上一下代码

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

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

第三方包

react-native-orientation-locker

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

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

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