uni-app 设置沉浸式的状态栏


uni-app 想要实现最顶部(手机预览包含电量信号的位置), 改成我们自己想要的,可以是透明状态

解决方案:

在pages.json文件中设置

1、全局取消原生导航栏,注释或者删除即可。

2、在每个页面单独配置style,当navigationStyle设为custom或titleNView设为false时,原生导航栏不显示:

{
  "path": "pages/index/index",
  "style": {
    "navigationBarTitleText": "首页", // 设置页面默认标题内容
    "navigationBarTextStyle": "white", // 导航栏标题颜色及状态栏前景颜色,仅支持 black/white
    // #ifdef H5     "titleNView": false, // 设置默认导航栏隐藏     // #endif     "enablePullDownRefresh": false, // 设置页面不可以下拉刷新     "app-plus": { // 设置默认导航栏隐藏       "titleNView": false     }   } },

有个质疑,在文件manifest.json 中,找到源码视图,这里有个可以设置开启沉浸式,但是我设置下面这个文件代码,不管设置不设置,也可以实现效果,嗯~~~,有待考究

可能在uniapp中,只设置上面代码即可,针对html5页面版的是需要设置的

"app-plus" : {
  "statusbar" : {
    "immersed" : true, //开启沉浸式
     "style" : "dark"
  },
   /* 模块配置 */
  "distribute" : {
     "ios" : {
      "UIReserveStatusbarOffset" : true /*IOS设置为沉浸栏模式*/
	},
  }
}

  


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM