真全屏需同时满足三条件:pages.json设navigationStyle:"custom"且titleNView:false;onShow中调plus.navigator.setFullscreen(true);CSS用--status-bar-height适配。缺一不可。

真全屏(隐藏状态栏 + 内容顶满屏幕)在 App 端必须同时满足三件事:配置交出控制权、调用原生 API、CSS 适配真实高度。只改 navigationStyle 或只调 setFullscreen 都会失败。
pages.json 必须设 navigationStyle: "custom" 并关 titleNView
这是所有操作的前提,不是可选项。不设这个,plus.navigator.setFullscreen(true) 在 Android 上最多只隐藏状态栏文字,顶部仍留白;iOS 则可能完全无反应。
-
"navigationStyle": "custom"的作用是把原生导航栏控制权彻底交还给前端,否则页面顶部永远被原生层预留空间 - 必须配套写
"app-plus": { "titleNView": false },否则 MIUI/HyperOS/ColorOS 等系统会在顶部渲染一个不可见的空白 title 区域,导致内容上移或出现 1px 白边 - 别混用
navigationBarHidden: true—— 这个字段在 APP 平台被忽略,写了也无效
onShow 中调 plus.navigator.setFullscreen(true)
这个 API 才是真正触发状态栏隐藏的关键动作,但它对时机和环境极其敏感。
- 必须放在
onShow(或onLaunch)里,不能放mounted、created或onLoad—— Vue 生命周期早于 plus 环境就绪,提前调用会静默失败 - 必须包裹
#ifdef APP-PLUS,否则 H5 和小程序运行时抛出plus is not defined - 单独调它只隐藏状态栏;若还要隐藏底部虚拟导航栏,得额外加
plus.navigator.hideSystemNavigation(),但注意:该方法在小米 HyperOS、OPPO ColorOS 14+ 等新系统上已失效,属系统限制,非代码问题
用 --status-bar-height 替代 JS 获取的高度
隐藏状态栏后内容没顶上去?不是 CSS 没写对,而是你还在用 uni.getSystemInfoSync().statusBarHeight —— 这个值在 Android 上常返回固定 24/25,全面屏机型不准,H5 和小程序甚至不返回。
- uni-app 在 App 端注入了可靠的 CSS 变量:
--status-bar-height,直接在根容器写padding-top: var(--status-bar-height); - 如果用了
<uni-nav-bar>,记得显式设background-color="transparent",否则默认背景色会挡住状态栏区域 - 下拉刷新时内容会穿透透明导航栏导致状态栏变黑,此时应临时禁用透明,比如用
:class="{ 'nav-transparent': !isPulling }"配合onPullDownRefresh控制
真机调试必须用正式打包的 IPA/APK —— HBuilderX 自带模拟器对 --status-bar-height 渲染不准,也不触发原生窗口 flags 设置,测不出真实沉浸效果。另外,iOS 15+ 上 setFullscreen 可能失效,需额外调 plus.navigator.setStatusBarStyle('light') 并确认 Info.plist 中已配置 UIViewControllerBasedStatusBarAppearance = YES。


















