最直接的关闭方式是修改manifest.json中app-plus→statusbar→immersed为false,使App启动时不启用沉浸式渲染,系统自动预留状态栏空间,避免页面内容与状态栏重叠;该配置仅对App端生效,需重新打包才有效。

manifest.json 中禁用沉浸式状态栏
App 端默认开启沉浸式,导致页面内容顶到状态栏下方、文字被遮挡或布局错乱。最直接的关闭方式不是改 pages.json,而是修改 manifest.json 里的 app-plus 配置项。
app-plus → statusbar → immersed 设为 false
在 manifest.json 文件中找到 "app-plus" 节点,添加或修改 statusbar 子配置:
{
"app-plus": {
"statusbar": {
"immersed": false
}
}
}
这个设置会让 App 启动时**不启用沉浸式渲染模式**,系统会为状态栏预留固定高度空间,页面内容自然下移、不再与状态栏重叠。
-
"immersed": false是唯一生效字段,其他如style或background在此模式下无效 - 该配置仅对 App 端(iOS/Android)起作用,H5 和小程序完全忽略
- 无需搭配
navigationStyle: "custom"—— 反而冲突:若同时设了custom,immersed: false会被覆盖,状态栏区域仍可能留白或错位 - 修改后必须重新打包(生成 IPA/APK),HBuilderX 模拟器不读取该配置,真机调试无效
为什么不用 pages.json 或 JS 控制?
有人试图在 pages.json 里设 "navigationStyle": "default" 或调 plus.navigator.setFullscreen(false) 来“取消沉浸”,但这些操作本质是「隐藏状态栏」或「交出控制权」,不是「禁用沉浸式布局逻辑」。真正决定是否预留状态栏空间的底层开关,只在 manifest.json 的 immersed 字段。
-
pages.json的navigationStyle控制的是原生导航栏显隐,不影响状态栏是否“融入”页面布局 -
plus.navigator.setFullscreen()只切换状态栏显隐,不改变页面根容器的初始 top 偏移量 - JS 获取的
statusBarHeight在禁用沉浸式后可能返回 0 或异常值,别依赖它做计算
禁用后状态栏颜色和文字怎么调?
禁用沉浸式后,状态栏恢复系统默认样式(通常黑字/白字取决于背景亮度),如需统一控制文字颜色,仍需在 pages.json 对应页面加:
"navigationBarTextStyle": "white"
或在 onShow 中调:
plus.navigator.setStatusBarStyle('light')
注意:setStatusBarStyle 仅在 immersed: true 时表现稳定;设为 false 后,部分 Android 厂商系统(如华为 EMUI)可能忽略该调用,iOS 则基本可用。
真正容易被忽略的是:禁用沉浸式后,所有页面都会统一按系统规则预留状态栏空间,但如果你某个页面用了自定义导航栏(比如 <view class="nav"></view>),记得把它原来的 padding-top: var(--status-bar-height) 去掉——这个 CSS 变量在 immersed: false 下不会注入,留着反而造成双倍顶部空白。











