Réponse https://stackoverflow.com/a/19249775/1502287 fonctionné pour moi, mais j'ai dû le changer un peu pour le faire fonctionner avec le plugin de caméra (et potentiellement d'autres) et une balise meta viewport avec "height = device- height "(ne pas régler la partie hauteur ferait apparaître le clavier sur la vue dans mon cas, masquant certaines entrées en cours de route).
Chaque fois que vous ouvrez la vue de la caméra et que vous revenez à votre application, la méthode viewWillAppear est appelée et votre vue diminue de 20 pixels.
En outre, la hauteur de l'appareil pour la fenêtre comprendrait les 20 pixels supplémentaires, ce qui rendrait le contenu défilable et 20px plus haut que la vue Web.
Voici la solution complète au problème de la caméra:
Dans MainViewController.h:
@interface MainViewController : CDVViewController
@property (atomic) BOOL viewSizeChanged;
@end
Dans MainViewController.m:
@implementation MainViewController
@synthesize viewSizeChanged;
[...]
- (id)init
{
self = [super init];
if (self) {
// On init, size has not yet been changed
self.viewSizeChanged = NO;
// 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 not already done
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7 && !self.viewSizeChanged) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 20;
viewBounds.size.height = viewBounds.size.height - 20;
self.webView.frame = viewBounds;
self.viewSizeChanged = YES;
}
[super viewWillAppear:animated];
}
Maintenant, pour le problème de la fenêtre d'affichage, dans votre écouteur d'événements deviceready, ajoutez ceci (en utilisant 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');
}
Voici la fenêtre que j'utilise pour les autres versions:
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0" />
Et tout fonctionne bien maintenant.