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"); 单独设置本页面状态样式