iphone - señal - iOS 7 barra de estado superposición de IU
icono de configuracion iphone (25)
Algunas de las respuestas anteriores le darán una barra negra en la parte superior si configura su pantalla con un límite de 20px, mientras que otra reducirá su pantalla de vista web si usa webview.frame.size.height -20px; Pruebe este, entonces, funciona en cualquier ios y no es necesario cambiar CSS, poner adentro
- (void)webViewDidFinishLoad:(UIWebView*)theWebView {
// es IOS7 y sube
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
// obtener el tamaño de la pantalla del dispositivo
CGRect screenBounds = [[UIScreen mainScreen] bounds];
// reduce la altura en 20px
int x= screenBounds.size.height -20;
// establece la vista superior de la web vista 20px por lo que está debajo de la barra de estado y reduce el tamaño en 20px
[theWebView setFrame:CGRectMake(0, 20, theWebView.frame.size.width, x )];
}
Recientemente me actualicé a xcode 5 y cuando ejecuto mi aplicación en el simulador iOS, la pantalla de bienvenida se superpone a la barra de estado y cuando estás en la aplicación la barra de estado se superpone a los elementos de mi aplicación, como un botón Atrás en la parte superior izquierda esquina de mano de mi aplicación. Construyo mi aplicación usando phonegap 2.9. Alguna idea de cómo puedo hacer que esto se reproduzca correctamente.
Aquí está mi enfoque usando CSS y Javascript:
1) Defina lo siguiente en su CSS:
#ios7-statusbar-fix {
width:100%;
height:20px;
background-color:white;
position:fixed;
z-index:10000;
margin-top:-20px;
display:none;
}
2) Agregue div-container con este id como primer elemento después de su <body> -tag:
<body>
<div id="ios7-statusbar-fix"></div>
…
3) Filtra dispositivos iOS 7 y aplica cambios a través de Javascript:
if (navigator.userAgent.match(/(iPad.*|iPhone.*|iPod.*);.*CPU.*OS 7_/d/i)) {
document.body.style.marginTop = ''20px'';
document.getElementById(''ios7-statusbar-fix'').style.display = ''block'';
}
Coloque este fragmento de código en su archivo MainViewController.m en el proyecto de phonegap.
- (void)viewDidLayoutSubviews{
if ([self respondsToSelector:@selector(topLayoutGuide)]) // iOS 7 or above
{
CGFloat top = self.topLayoutGuide.length;
if(self.webView.frame.origin.y == 0){
// We only want to do this once, or
// if the view has somehow been "restored" by other code.
self.webView.frame = CGRectMake(self.webView.frame.origin.x,
self.webView.frame.origin.y + top,
self.webView.frame.size.width,
self.webView.frame.size.height-top);
}
}
}
Comencé a seguir esta ruta, pero tengo mi propio control de navegación con una core view que deslizo dentro de un marco que generalmente está envolviendo el núcleo con una barra de título común y tabbar ; sin storyboard , sin UINavigationController .
Comenzó a complicarse rápidamente, agregando y restando los 20 píxeles de la barra de estado. Entonces una epifanía.
Hice una copia del .xib file , le dije a Xcode que me lo mostrara como un diseño iOS 7, realineé todo y puse un solo interruptor 6/7 en el código ... al instante, todo funciona bien, y los recursos adicionales solo agregan 8K al paquete.
Con el lanzamiento de iOS 7.0.4, el arreglo iOS7 se rompió en mi proyecto actual, ya que 7.0.4 funciona sin la solución. Así que se agregó un control menor para ejecutarlo solo si se ejecuta una versión menor de 3 o menos.
NSArray *vComp = [[UIDevice currentDevice].systemVersion componentsSeparatedByString:@"."];
if ([[vComp objectAtIndex:0] intValue] == 7 && [[vComp objectAtIndex:1] intValue] == 0 && [[vComp objectAtIndex:2] intValue] <= 3 ) {
CGRect oldBounds = [self.view bounds];
CGRect newViewBounds = CGRectMake( 0, -10, oldBounds.size.width, oldBounds.size.height-20 );
CGRect newWebViewBounds = CGRectMake( 0, -20, oldBounds.size.width, oldBounds.size.height-40 );
[self.view setBounds:newViewBounds];
[self.webView setBounds:newWebViewBounds];
}
De hecho, creo que la respuesta de Gimi es la mejor respuesta, ¡y he estado buscando mucho! Solo para agregar a la respuesta de Gimi, y también contestar la respuesta de ignacio-munizaga sobre esa respuesta, el código se ejecutará cada vez que aparezca la vista, lo que significa después de cerrar un navegador en línea, o después de la cámara, etc. así que puse un valor bool si el tamaño ya ha sido ajustado.
El código final se ve así:
bool sizeWasAdjusted = false;
- (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 (!sizeWasAdjusted && [[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 18;
viewBounds.size.height = viewBounds.size.height - 18;
self.webView.frame = viewBounds;
sizeWasAdjusted = true;
}
[super viewWillAppear:animated];
}
De la Guía de transición de Apple iOS7 ,
Específicamente,
self.automaticallyAdjustsScrollViewInsets = YES;
self.edgesForExtendedLayout = UIRectEdgeNone;
funciona para mí cuando no quiero superponerme y tengo un UITableViewController.
Desarrollé para iOS7 primero, pero para mantenerme compatible con iOS6 hago exactamente lo contrario de lo que sugirió Gimi: en MainViewController.m Configuré el origen y 20px y MainViewController.m la altura de vista en 20px:
//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;
}
El mejor enfoque que puede usar es cambiar el tamaño de la vista principal, especialmente si su aplicación utiliza un pie de página.
en MainViewController.m usando el método viewDidLoad, después de [super viewDidLoad];
NSArray *vComp = [[UIDevice currentDevice].systemVersion componentsSeparatedByString:@"."];
if ([[vComp objectAtIndex:0] intValue] >= 7) {
// iOS 7 or above
CGRect oldBounds = [self.view bounds];
CGRect newViewBounds = CGRectMake( 0, -10, oldBounds.size.width, oldBounds.size.height-20 );
CGRect newWebViewBounds = CGRectMake( 0, -20, oldBounds.size.width, oldBounds.size.height-40 );
[self.view setBounds:newViewBounds];
[self.webView setBounds:newWebViewBounds];
}
entonces no necesitarás modificar ningún javascript en tu aplicación
En MainViewController.m inside: - (void)viewWillAppear:(BOOL)animated añade esto:
//Lower screen 20px on ios 7
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 18;
viewBounds.size.height = viewBounds.size.height - 18;
self.webView.frame = viewBounds;
}
entonces la función final se verá así:
- (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 = 18;
viewBounds.size.height = viewBounds.size.height - 18;
self.webView.frame = viewBounds;
}
[super viewWillAppear:animated];
}
En la propiedad del conjunto de archivos .plist:
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
Oculta la barra de estado.
Es mejor tener esto en info.plist
<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
esto no crea ninguna barra de estado.
Escriba el siguiente código dentro de AppDelegate.m en el evento didFinishLaunchingWithOptions (exactamente antes de su última línea de código " return YES; "):
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7)
{
[application setStatusBarHidden:YES withAnimation:UIStatusBarAnimationNone];
}
Voy a esperar tus comentarios! :)
Intente (app name)-Info.plist archivo de la aplicación (app name)-Info.plist en XCode y agregue la clave
view controller-based status bar appearance: NO
status bar is initially hidden : YES
Esto parece funcionar para mí sin problema.
Lo que suelo hacer es agregar dos propiedades de clave-valor al archivo Info.plist .
El código fuente de las propiedades es:
Muchas gracias hombre. Funcionó bien en:
MAC OS X 10.9.1 - Xcode 5.0.2 - cordova 3.3 - jQuery mobile 1.3.2 .
Para abordar el problema de la barra de estado iOS7, podemos usar el siguiente código para Cordova / PhoneGap:
function onDeviceReady() {
if (parseFloat(window.device.version) === 7.0) {
document.body.style.marginTop = "20px";
}
}
document.addEventListener(''deviceready'', onDeviceReady, false);
De todos modos, Cordova 3.1 pronto arreglará este y otros problemas para iOS7.
Puede resolver este problema si está usando guiones gráficos, como en esta pregunta: iOS 7: la barra de estado se superpone a la vista
Si no está usando el guión gráfico, puede usar este código en su AppDelegate.m en el did finishlaunching :
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);
}
También vea esta pregunta: Barra de estado y problema de barra de navegación en IOS7
Si está desarrollando para iOS 7, no recomendaría envolver la barra de estado en un rectángulo negro con el estilo iOS anterior. Simplemente integrelo en el diseño para obtener un aspecto de "pantalla completa" de iOS 7.
Puede usar este complemento para ajustar el color de la tinta de la barra de estado, u ocultarla o mostrarla en cualquier instancia de su aplicación.
https://github.com/jota-v/cordova-ios-statusbar
Los métodos js son:
window.plugins.statusBar.hide();
window.plugins.statusBar.show();
window.plugins.statusBar.blackTint();
window.plugins.statusBar.whiteTint();
IMPORTANTE: También en su archivo de aplicación, configure UIViewControllerBasedStatusBarAppearance en NO .
Si está usando Cordova con Sencha Touch y está utilizando las barras de navegación / título normales de Sencha Touch, puede estirar la barra de navegación y reposicionar el contenido dentro de la barra de navegación para que se vea en casa en iOS 7. Simplemente agregue esto a la app.js (después de su última línea Ext.Viewport.add ):
// Adjust toolbar height when running in iOS to fit with new iOS 7 style
if (Ext.os.is.iOS && Ext.os.version.major >= 7) {
Ext.select(".x-toolbar").applyStyles("height: 62px; padding-top: 15px;");
}
(Fuente: http://lostentropy.com/2013/09/22/ios-7-status-bar-fix-for-sencha-touch-apps/ )
Esto es un poco hacky, lo sé, pero ahorra lidiar con él en el nivel Objective-C. Sin embargo, no será muy útil para aquellos que no usan Sencha Touch con Cordova.
También podemos verificar esto dentro de nuestros archivos js
if (parseFloat(window.device.version) >= 7.0) {
$("body").addClass("ios7");
}
En el archivo .css define una clase para este
.ios7 .ui-page, .ios7 .ui-header, .ios7 .ui-pane {
margin-top: 17px !important;
}
Tengo un problema al abrir el navegador inApp con Phonegap. La solución de Gimi funcionó bien, pero cada vez que abrí el navegador inApp, la pantalla se reducía en la parte inferior. Así que agregué una declaración if para verificar si el origen y de la vista web era 0. El navegador inApp ya no tiene el origen y 0, así que resolvió mi problema.
// ios 7 status bar fix
- (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) {
if(self.webView.frame.origin.y == 0) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 20;
viewBounds.size.height = viewBounds.size.height - 20;
self.webView.frame = viewBounds;
}
}
[super viewWillAppear:animated];
}
La solución no es realmente mía pero no puedo encontrar la fuente. ¡Espero eso ayude!
Uso este código en el método ViewDidLoad.
if ([self respondsToSelector:@selector(edgesForExtendedLayout)])
{
self.edgesForExtendedLayout = UIRectEdgeNone;
}
Esto funciona al tratar de soportar versiones anteriores de iOS también.
Para iPhoneX
Para todas las respuestas anteriores:
La altura de la barra de estado en el iPhoneX es 44 y no 20
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7.0) {
self.window.clipsToBounds =YES;
[application setStatusBarStyle:UIStatusBarStyleLightContent];
self.window.frame = CGRectMake(0,20,self.window.frame.size.width,self.window.frame.size.height-20);
}