Best way to set Statubar


#1

I’m trying to figure out the best method to get the statusbar on iOS 7 to appear like all other apps.

Light Content
Show Statusbar

I keep getting the header under the statusbar rather than expand for the statusbar. I’m using PhoneGap build.

I have included the StatusBar plugin and the Device plugin It appears that i’m not getting the extra css classes to appear.

Any help would be appreciated.


#2

I forgot to include the javascript i’m using.

ionic.Platform.ready(function(){
    ionic.Platform.fullScreen(false, true);
});

#3

Another option is in the root config.xml file, add these lines

 <preference name="StatusBarOverlaysWebView" value="true" />
 <preference name="StatusBarBackgroundColor" value="#000000" />

The first line sets the app to be full screen or not and the second set the background color of the status area


#4

or do it in code like:

app.run(function($rootScope, $http) {
  var showFullScreen = true,
      showStatusBar = true;

  ionic.Platform.ready(function(){
    if(window.StatusBar) {
      //ionic.Platform.fullScreen(showFullScreen, showStatusBar);
      StatusBar.overlaysWebView(true);
      //StatusBar.backgroundColorByName('green');
      StatusBar.backgroundColorByHexString("#43CEE6");  //Calm color
    }