uni-app 使用.9.png方式设置沉浸式状态栏后状态栏闪现且启动图位移

uni-app 使用.9.png方式设置沉浸式状态栏后状态栏闪现且启动图位移

开发环境 版本号 项目创建方式
HBuilderX 3.1.22 云端

启动app则可见。


预期结果: 导航栏应该不出现,或者一直出现。


实际结果: 导航栏出现又消失。导致启动图位移。


bug描述: 按照要求制作了3张9png图,同时导航栏设置沉浸式

"statusbar" : {  
    //沉浸式导航    
    "immersed" : true  
},

更多关于uni-app 使用.9.png方式设置沉浸式状态栏后状态栏闪现且启动图位移的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 使用.9.png方式设置沉浸式状态栏后状态栏闪现且启动图位移的实战教程也可以访问 https://www.itying.com/category-93-b0.html


根据你的描述,这是一个典型的沉浸式状态栏与启动图配合问题。核心原因是状态栏的显示时机与启动图的渲染存在时序冲突。

问题分析:

  1. 状态栏闪现:应用启动时,系统会先显示默认状态栏,随后 uni-app 应用层代码执行,"immersed": true 生效,状态栏变为沉浸式(透明/隐藏)。这个过程不是原子的,导致用户能看到状态栏从“显示”到“隐藏”的瞬间变化。
  2. 启动图位移:状态栏从“占据空间”变为“不占据空间”(沉浸式),会导致页面可用高度突变。如果启动图是页面内图像(非原生启动屏),就会因页面布局重排而出现明显的位移或跳动。

解决方案:

方案一(推荐):使用原生启动图(splashscreen)manifest.jsonapp-plus -> splashscreen 节点下配置:

"app-plus": {
  "splashscreen": {
    "autoclose": true,
    "waiting": true,
    "delay": 0
  }
}
回到顶部