最近在使用apicloud開發一款APP，專案沒有使用安卓和ios開發人員，選擇APICLOUD開發，猶豫UI設計的導航欄是沉浸式，在Android和ios上的效果是不一樣的，ios上導航欄會浮在內容上面，將內容部分遮擋，如圖：

我要達到的是不希望導航欄遮擋住內容部分，經過不懈的努力和各種嘗試，終於解決了這個問題，具體步驟如下：
1、在config檔案裡面配置

  <preference name="statusBarAppearance" value="true"/>

2、通過判斷手機型別給header新增padding-top

var systemType =
 
 api.systemType;  // 獲取手機型別，比如： ios
  var header = document.querySelector('#header');
  if(systemType=='ios'){//相容ios和安卓
    $api.addCls(header, 'headerIos');
  }else{
    $api.addCls(header, 'headerAnd');
  }
  api.setStatusBarStyle({
    color: '#0063ff',//設定APP狀態列背景色
    style: 'light'
  });

css程式碼：（由於Android和ios的狀態列高度不同）

//其中，IOS狀態列高度為20px，Android為25px
/*相容ios和Android*/
.headerIos{
  padding-top: 20px;
}
.headerAnd{
  padding-top: -25px;
}

在對應頁面執行步驟2的方法即可實現效果