uni-app中 "navigationBarTextStyle": "black" 设置无效

uni-app中 “navigationBarTextStyle”: “black” 设置无效

示例代码:

"navigationBarTextStyle": "black",

操作步骤:

用uniapp示例项目测试,bug复现。

预期结果:

状态栏为黑色

实际结果:

状态栏为白色

bug描述:

“navigationBarTextStyle”: “black” 无效,状态栏字体颜色仍为白色。导致背景颜色为白色时,看不到状态栏。 已经用uniapp示例项目测试,bug复现。

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Mac
PC开发环境操作系统版本号 11.2.3 (20D91)
HBuilderX类型 正式
HBuilderX版本号 3.1.22
手机系统 Android
手机系统版本号 Android 7.0
手机厂商 华为
手机机型 meta10
页面类型 vue
打包方式 云端
项目创建方式 HBuilderX

更多关于uni-app中 "navigationBarTextStyle": "black" 设置无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

6 回复

请详细描述下您的问题 您是在globalStyle下设置的"navigationBarTextStyle": “black”,还是在页面style下设置的?

更多关于uni-app中 "navigationBarTextStyle": "black" 设置无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


globalStyle设置也试过,页面style设置也试过,两个一起设置也试过,均不生效。状态栏颜色一直是白色。

回复 NSK: 上一个版本是否正常?还是说一直这样?

回复 DCloud_UNI_Anne: 上个版本也不正常,部分手机正常,部分手机不正常

同样遇到这样的问题,感觉一用这个开发全是坑

问题分析:

navigationBarTextStyle 仅控制导航栏标题文字颜色(黑/白),不控制状态栏(电池、时间等系统栏)字体颜色。状态栏颜色由 app-plus 下的 statusbar 配置或系统主题决定。

解决方案:

  1. 修改状态栏样式(App端):pages.jsonglobalStyle 或页面样式中配置:

    "app-plus": {
      "statusbar": {
        "style": "dark" // 或 "light",仅iOS有效;Android需配合backgroundColor使用
      }
    }
    
  2. Android状态栏背景色适配: 若需状态栏字体变黑且背景为浅色,需同时设置背景色(Android 6.0+):

    "app-plus": {
      "statusbar": {
        "style": "dark",
        "background": "#FFFFFF" // 设置状态栏背景色为白色
      }
    }
回到顶部