La respuesta https://stackoverflow.com/a/19249775/1502287 funcionó para mí, pero tuve que cambiarlo un poco para que funcionara con el complemento de la cámara (y potencialmente con otros) y una metaetiqueta de la ventana gráfica con "height = device- height "(no establecer la parte de altura haría que el teclado apareciera sobre la vista en mi caso, ocultando algunas entradas en el camino).
Cada vez que abría la vista de la cámara y volvía a su aplicación, se llamaría al método viewWillAppear y su vista se reduciría en 20px.
Además, la altura del dispositivo para la ventana gráfica incluiría los 20 px adicionales, lo que hace que el contenido sea desplazable y 20 px más alto que la vista web.
Aquí está la solución completa para el problema de la cámara:
En MainViewController.h:
@interface MainViewController : CDVViewController
@property (atomic) BOOL viewSizeChanged;
@end
En 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];
}
Ahora para el problema de la ventana gráfica, en su detector de eventos listo para el dispositivo, agregue esto (usando 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');
}
Aquí está la ventana gráfica que uso para otras versiones:
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0" />
Y todo funciona bien ahora.