uni-app wap2app 设置沉浸式状态栏无效

uni-app wap2app 设置沉浸式状态栏无效

产品分类：其他/wap2app

示例代码：

"plus":{  
      "statusbar" : {  
            "immersed" : true  
        },  
}

操作步骤：

无效

预期结果：

有效

实际结果：

无效

bug描述：

"immersed" : true后变成灰色背景如下图；

平台：Android 10
手机：红米Note7 (MUI 12)
HBuilderX Alpha 最新 和 HBuilderX 正式版最新都测试
manifest.json 配置 沉浸式状态

"plus":{  
      "statusbar" : {  
            "immersed" : true  
        },  
}

以下运行模式【真机和虚拟机】都测试过，均无效：

  1. 正式打包
  2. 自定义基座
  3. 标准基座

请问 Android 端 沉侵模式配置我还遗漏哪里没配置吗？？，是不是BUG？？

IOS 端说是需要正式打包才有效，我没有证书，还没测试有没有问题，反正目前 Android 是无效的。
不知道是不是 红米手机的滴水屏的问题？？

Image 1 Image 2 Image 3


更多关于uni-app wap2app 设置沉浸式状态栏无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app wap2app 设置沉浸式状态栏无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 wap2app 项目中，沉浸式状态栏配置需要额外处理。仅设置 "immersed": true 可能不足以实现预期效果，因为 wap2app 本质上加载的是 Web 页面，状态栏样式受 WebView 和系统限制。

检查以下配置：

  1. 在 manifest.json 中确认 "statusbar" 配置位于 "app-plus" 节点下，而非 "plus"。正确路径为：
"app-plus": {
    "statusbar": {
        "immersed": true
    }
}
  1. 对于 Android，沉浸式状态栏需要页面内容延伸到状态栏区域。在 wap2app 中，需通过 CSS 适配：
page {
    padding-top: var(--status-bar-height);
}

并在页面中设置背景色，确保状态栏文字可读。

  1. 部分 Android 机型（如红米 Note 7 的 MIUI 12）对沉浸式状态栏支持存在兼容性问题，尤其是“水滴屏”设备。可尝试在代码中动态设置状态栏样式：
plus.navigator.setStatusBarStyle('light'); // 或 'dark'
回到顶部