iOS 7 Status Bar with Phonegap

iOS 7 Status bar with Phonegap

I found an answer on another thread, but I'll answer the question in case someone else wonders.

Just replace the viewWillAppear in MainViewController.m with this:

- (void)viewWillAppear:(BOOL)animated {
    // View defaults to full size.  If you want to customize the view's size, or its subviews (e.g. webView),
    // you can do so here.
    // Lower screen 20px on ios 7
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
        CGRect viewBounds = [self.webView bounds];
        viewBounds.origin.y = 20;
        viewBounds.size.height = viewBounds.size.height - 20;
        self.webView.frame = viewBounds;
    }
    [super viewWillAppear:animated];
}

Hiding status bar in iOS 7 when using PhoneGap Build 3?

This worked for me on my Phonegap Build App [Bd v3.4.0]:

In config.xml :

On device ready function:

 StatusBar.hide();

Reference: https://github.com/phonegap-build/StatusBarPlugin

iOS 7 status bar overlapping UI - Need solution for Cordova 3.0

If you don't want to hide status bar check this solution

function onDeviceReady() {
    if (parseFloat(window.device.version) === 7.0) {
          document.body.style.marginTop = "20px";
    }
}


document.addEventListener('deviceready', onDeviceReady, false);

OR
Hide the status bar

Open Project in xcode first select checkbox ( hide during application launch ) under status bar style - general project settings in xcode

select projectname-info.plist (Resources section in xcode)

and add key "View controller-based status bar appearance" and value "NO"

iOS 7 - Fixed status bar, now bottom of PhoneGap app is cut off by 20px

https://stackoverflow.com/a/19188984/706751

This is the best solution for people using PhoneGap who experience the iOS 7 Status Bar issue. If other solutions clip your content or don't do well with rotation, this is probably going to work for you!

---

Related Topics