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