apicloud APP沉浸式狀態欄設置


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"); 單獨設置本頁面狀態樣式


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM