Search code examples
iphoneionic-framework

Ionic ion-view header behind ios status bar

How do I avoid ionic header from getting behind ios status bar like this?

enter image description here

I created the header with following code:

<ion-view title="{{title}}" hide-nav-bar="false">
Solution

  • Finally the problem is solved.

    in app.js

    $ionicPlatform.ready(function() {
  if (window.cordova && $cordovaKeyboard) {
    $cordovaKeyboard.hideAccessoryBar(true);
  }
  if (window.StatusBar) {
    StatusBar.styleDefault();
  }
}

    and, if that doesn't solve the problem yet. In index.html, cordova.js should be imported on the very last.

    <head>
    ...

    <script src="cordova.js"></script>
</head>

    This solve my problem.