引自：http://*.com/questions/19209781/ios-7-status-bar-with-phonegap
情景：在ios7下PhoneGap app会上移20px从而被状态栏挡住，查找了些方法后可以解决这问题，但是拍照完返回界面后仍然会出现上移20px的情况，参考了链接后，最终解决方法如下：
in AppDelegate.m //兼容启动页上移20px
- (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions
{
CGRect screenBounds = [[UIScreen mainScreen] bounds]; #if __has_feature(objc_arc)
self.window = [[UIWindow alloc] initWithFrame:screenBounds];
#else
self.window = [[[UIWindow alloc] initWithFrame:screenBounds] autorelease];
#endif
self.window.autoresizesSubviews = YES; #if __has_feature(objc_arc)
self.viewController = [[MainViewController alloc] init];
#else
self.viewController = [[[MainViewController alloc] init] autorelease];
#endif
self.viewController.useSplashScreen = YES; // Set your app's start page by setting the <content src='foo.html' /> tag in config.xml.
// 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, 20, self.window.frame.size.width, self.window.frame.size.height-20);
} return YES;
}
In MainViewController.h:
@interface MainViewController : CDVViewController
@property(atomic)BOOL viewSizeChanged;
@property(atomic)int number;
@end
In MainViewController.m:
@implementation MainViewController
@synthesize viewSizeChanged;
@synthesize number;
[...]
- (id)init
{
self = [super init];
if (self) {
self.viewSizeChanged=NO;
self.number=0;
// Uncomment to override the CDVCommandDelegateImpl used
// _commandDelegate = [[MainCommandDelegate alloc] initWithViewController:self];
// Uncomment to override the CDVCommandQueue used
// _commandQueue = [[MainCommandQueue alloc] initWithViewController:self];
}
return self;
} [...]
- (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] >= && !self.viewSizeChanged) {
if (self.number==1) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = ;
viewBounds.size.height = viewBounds.size.height - ;
self.webView.frame = viewBounds;
self.viewSizeChanged = YES;
} self.number=1;
}
[super viewWillAppear:animated];
}
Now for the viewport problem, in your deviceready event listener, add this (using jQuery):
if (window.device && parseFloat(window.device.version) >= 7) {
$(window).on('orientationchange', function () {
var orientation = parseInt(window.orientation, 10);
// We now the width of the device is 320px for all iphones
// Default height for landscape (remove the 20px statusbar)
var height = 300;
// Default width for portrait
var width = 320;
if (orientation !== -90 && orientation !== 90 ) {
// Portrait height is that of the document minus the 20px of
// the statusbar
height = document.documentElement.clientHeight - 20;
} else {
// This one I found experimenting. It seems the clientHeight
// property is 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',
'width=' + width + ',' +
'height=' + height + ',' +
'initial-scale=1.0,maximum-scale=1.0,user-scalable=no');
})
.trigger('orientationchange');
}
Here is the viewport I use for other versions:
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0" />
测试结果：完美解决。