PHONEGAP compatible iOS Move up 20px

Citation: Http://stackoverflow.com/questions/19209781/ios-7-status-bar-with-phonegap

Scenario: Under iOS7 phonegap app will move up 20px to be blocked by the status bar, find some methods to solve the problem, but after the return screen after the photo will still appear to move 20px, after referring to the link, the final solution is as follows:

In APPDELEGATE.M//compatible Start page move up 20px

-(BOOL) Application: (uiapplication*) Application didfinishlaunchingwithoptions: (nsdictionary*) launchoptions{CGRect screenbounds=[[UIScreen mainscreen] bounds];#if__has_feature (OBJC_ARC)Self.window=[[UIWindow alloc] initwithframe:screenbounds];#elseSelf.window=[[[ UIWindow alloc] initwithframe:screenbounds] autorelease];#endifself.window.autoresizesSubviews=YES;#if__has_feature (OBJC_ARC)Self.viewcontroller=[[Mainviewcontroller alloc] init];#elseSelf.viewcontroller=[[[ Mainviewcontroller alloc] init] autorelease];#endifSelf.viewController.useSplashScreen=YES; //Set your app ' s start page by setting the <content src= ' foo.html '/> tag in config. //If necessary, uncomment the line below to override it. //self.viewController.startPage = @ "index.html"; //note:to Customize the View ' s frame size (which defaults to full screen), override//[Self.viewcontroller viewwillappear:] in your view controller.Self.window.rootViewController=Self.viewcontroller;    [Self.window makekeyandvisible]; if([[[[Uidevice Currentdevice] systemversion] Floatvalue] >=7) {[Application setstatusbarstyle:uistatusbarstylelightcontent]; Self.window.clipsToBounds=YES; Self.window.frame= CGRectMake (0, -, Self.window.frame.size.width, self.window.frame.size.height- -); }        returnYES;}

In MainViewController.h:

@interface Mainviewcontroller:cdvviewcontroller@property (atomic) BOOL viewsizechanged; @end

In MAINVIEWCONTROLLER.M:

@implementationMainviewcontroller@synthesizeviewsizechanged; [...]- (ID) init{ Self=[Super Init]; if(self) {//On init, size have not yet been changedSelf.viewsizechanged =NO; //uncomment to override the Cdvcommanddelegateimpl used//_commanddelegate = [[Maincommanddelegate alloc] initwithviewcontroller:self]; //uncomment to override the Cdvcommandqueue used//_commandqueue = [[Maincommandqueue alloc] initwithviewcontroller:self];    }    returnSelf ;} [...]- (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 it here . //Lower screen 20px on iOS 7    if([[[[Uidevice Currentdevice] systemversion] Floatvalue] >=7) {CGRect viewbounds=[Self.webview bounds]; if(VIEWBOUNDS.ORIGIN.Y = =0&&self.viewsizechanged) {VIEWBOUNDS.ORIGIN.Y= -; ViewBounds.size.height= ViewBounds.size.height- -; } self.webView.frame=Viewbounds; Self.viewsizechanged=YES; } [Super viewwillappear:animated];}

Now for the viewport problem, in your Deviceready event listener, add this (using JQuery):

1 if(Window.device && parsefloat (window.device.version) >= 7) {2$ (window). On (' Orientationchange ',function () {3       varOrientation = parseint (Window.orientation, 10);4       //We Now the width of the device are 320px for all iphones5       //Default height for landscape (remove the 20px statusbar)6       varHeight = 300;7       //Default width for portrait8       varwidth = 320;9       if(Orientation!== -90 && Orientation!== 90 ) {Ten         //Portrait Height is, that of the document minus the 20px of One         //The StatusBar AHeight = document.documentelement.clientheight-20; -}Else { -         //This one I found experimenting. It seems the clientheight the         //wrongly set (or I misunderstood how it was -         //supposed to work). -         //dunno if it ' s specific to my setup. -width = document.documentElement.clientHeight + 20; +       } -Document.queryselector (' meta[name=viewport] ') +. SetAttribute (' content ', A' width= ' + width + ', ' + at' height= ' + height + ', ' + -' Initial-scale=1.0,maximum-scale=1.0,user-scalable=no '); -     }) -. Trigger (' Orientationchange '); -}

Here are the viewport I use for other versions:

1 <  name= "Viewport"  content= "Width=device-width,user-scalable=no, initial-scale=1.0,maximum-scale=1.0 "/>

Test Result: perfect solution.

PHONEGAP compatible iOS Move up 20px