react native 设置屏幕锁定

原生配置

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();
  }

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

相关推荐
失落的多巴胺1 小时前
使用deepseek制作“喝什么奶茶”随机抽签小网页
javascript·css·css3·html5
DataGear1 小时前
如何在DataGear 5.4.1 中快速制作SQL服务端分页的数据表格看板
javascript·数据库·sql·信息可视化·数据分析·echarts·数据可视化
影子信息1 小时前
vue 前端动态导入文件 import.meta.glob
前端·javascript·vue.js
样子20181 小时前
Vue3 之dialog弹框简单制作
前端·javascript·vue.js·前端框架·ecmascript
kevin_水滴石穿1 小时前
Vue 中报错 TypeError: crypto$2.getRandomValues is not a function
前端·javascript·vue.js
翻滚吧键盘1 小时前
vue文本插值
javascript·vue.js·ecmascript
海的诗篇_3 小时前
前端开发面试题总结-原生小程序部分
前端·javascript·面试·小程序·vue·html
黄瓜沾糖吃5 小时前
大佬们指点一下倒计时有什么问题吗?
前端·javascript
温轻舟5 小时前
3D词云图
前端·javascript·3d·交互·词云图·温轻舟
浩龙不eMo5 小时前
✅ Lodash 常用函数精选(按用途分类)
前端·javascript