config.xml配置
<preference name="statusBarAppearance" value="true"/>
<preference name="iOS7StatusBarAppearance" value="true"/>
兼容android、ios設備,可以動態設置指定頁面狀態欄背景色以及字體顏色
/***設置狀態欄樣式
@param {string} color APP狀態欄背景顏色
@param {string} style APP狀態欄文字顏色
@param {bool} contentTop 是否設置content頂部內邊距
*/
function setStatusBar(color, style, contentTop) {
api.setStatusBarStyle({
color: color,
style: style
});
// 沉浸式狀態欄為 header 設置 paddingTop
$api.fixStatusBar($api.dom('header'));
$api.fixIos7Bar($api.dom('header'));
$api.fixTabBar($api.dom('footer'));
$('header').height(44);
contentTop == false ? contentTop = contentTop : contentTop = true;
if(document.querySelector("header") && contentTop == true)
{
// console.log(document.querySelector("header").offsetHeight);
$(".content,.mui-content").css({'padding-top': document.querySelector("header").offsetHeight});
}
}
頁面調用 setStatusBar("rgba(255,255,255,.0)", "dark"); 單獨設置本頁面狀態樣式