uni-app 設定沉浸式的狀態列
阿新 • • 發佈:2020-12-09
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設定為沉浸欄模式*/ },
}
}