In iOS 7 werden Phonegap-Anwendungen unter der Statusleiste angezeigt. Dies kann es schwierig machen, auf Schaltflächen / Menüs zu klicken, die oben auf dem Bildschirm platziert wurden.
Gibt es jemanden, der eine Möglichkeit kennt, dieses Problem in der Statusleiste unter iOS 7 in einer Phonegap-Anwendung zu beheben?
Ich habe versucht, die gesamte Webseite mit CSS zu versetzen, aber es scheint nicht zu funktionieren. Gibt es eine Möglichkeit, das gesamte UIWebView zu versetzen oder die Statusleiste einfach so zu gestalten, wie es in iOS6 der Fall war?
Vielen Dank
Antworten:
Ich habe eine Antwort in einem anderen Thread gefunden, aber ich werde die Frage beantworten, falls sich jemand anderes wundert.
Ersetzen Sie einfach die
viewWillAppear
inMainViewController.m
mit diesem:quelle
Zusätzlich zu Ludwig Kristofferssons Korrektur der Größenänderung empfehle ich, die Farbe der Statusleiste zu ändern:
quelle
Bitte installieren Sie das Plugin für Phonegap: https://build.phonegap.com/plugins/505
Verwenden Sie die richtige Einstellung wie unten, um die Überlagerung der Webansicht zu steuern:
Bei mir funktioniert es mit Phonegap 3.3.0.
Weitere Informationen finden Sie auf der Github-Projektseite: https://github.com/phonegap-build/StatusBarPlugin
quelle
Fügen Sie zum Ausblenden der Statusleiste den folgenden Code in die Datei
MainViewController.m
unter der Funktion ein-(void)viewDidUnload
quelle
Antwort https://stackoverflow.com/a/19249775/1502287 funktionierte für mich, aber ich musste es ein wenig ändern, damit es mit dem Kamera-Plugin (und möglicherweise anderen) und einem Meta-Tag für das Ansichtsfenster mit "height = device-" funktioniert. height "(wenn Sie den Höhenbereich nicht einstellen, wird die Tastatur in meinem Fall über der Ansicht angezeigt und einige Eingaben werden auf dem Weg ausgeblendet).
Jedes Mal, wenn Sie die Kameraansicht öffnen und zu Ihrer App zurückkehren, wird die viewWillAppear-Methode aufgerufen und Ihre Ansicht um 20 Pixel verkleinert.
Außerdem würde die Gerätehöhe für das Ansichtsfenster die 20 zusätzlichen Pixel enthalten, wodurch der Inhalt scrollbar und 20 Pixel höher als die Webansicht wird.
Hier ist die vollständige Lösung für das Kameraproblem:
In MainViewController.h:
In MainViewController.m:
Fügen Sie nun für das Viewport-Problem in Ihrem deviceready-Ereignis-Listener Folgendes hinzu (mithilfe von jQuery):
Hier ist das Ansichtsfenster, das ich für andere Versionen verwende:
Und jetzt funktioniert alles gut.
quelle
Versuchen Sie, in die App-
(app name)-Info.plist
Datei in XCode zu gehen und die Schlüssel hinzuzufügenDas funktioniert bei mir problemlos.
quelle
Für Cordova 3.1+ gibt es ein Plugin, das sich mit der Änderung des Verhaltens der Statusleiste für iOS 7+ befasst.
Das ist schön dokumentiert hier , darunter , wie die Statusleiste kann den vorherigen iOS7 Zustand rückgängig gemacht werden.
Führen Sie Folgendes aus, um das Plugin zu installieren:
Fügen Sie dies dann zu config.xml hinzu
quelle
Ich löse mein Problem, indem ich das installiere
org.apache.cordova.statusbar
und in meinem Top hinzufügeconfig.xml
:Diese Konfigurationen funktionieren nur für iOS 7+
Referenz: http://devgirl.org/2014/07/31/phonegap-developers-guid/
quelle
Weitere Informationen finden Sie im neuen Cordova StatusBar-Plugin, das genau dieses Problem behebt. http://docs.icenium.com/troubleshooter/ios7-status-bar#solution Option 3
quelle
Ich verwende den folgenden Code, um dem Body eine Klasse hinzuzufügen, wenn iOS7 erkannt wird. Ich gestalte diese Klasse dann, um eine hinzuzufügen
20px
oben in meinem Container Rand eingefügt wird. Stellen Sie sicher, dass Sie das Plugin "Gerät" installiert haben und dass sich dieser Code im Ereignis "deviceready" befindet.Beim Lesen habe ich gehört, dass das nächste Update von Phonegap (3.1, glaube ich) die Änderungen an der Statusleiste von iOS7 besser unterstützt. Dies kann also nur als kurzfristige Lösung erforderlich sein.
quelle
Ludwigs Antwort hat bei mir funktioniert.
Für alle, die seine Antwort verwendet haben und nun versuchen, die Farbe des weißen Randes zu ändern (mag trivial erscheinen, mich aber verblüfft haben), sehen Sie Folgendes:
Wie kann ich die UIWebView-Hintergrundfarbe nach dem Herunterschieben von UIWebView ändern, um das Problem mit der Überlagerung der iOS7-Statusleiste zu beheben?
quelle
Ein anderer Weg ist abwärtskompatibel .
iOS 7
Erstellen Sie den HTML- Code gemäß (mit einem zusätzlichen Rand von 20 Pixel oben), um diesenfull screen
Look zu erzielen, und schneiden Sie den zusätzlichen Rand für abiOS < 7.0
. So etwas wie das Folgende inMainViewController.m
:Diese Lösung hinterlässt oben
iOS 7.0
und oben keinen schwarzen Balken , den ein moderner iOS-Benutzer seltsam und alt findet .quelle
Schreiben Sie den folgenden Code in AppDelegate.m in das Ereignis didFinishLaunchingWithOptions (genau vor der letzten Codezeile " return YES; "):
Ich werde auf Ihr Feedback warten! :) :)
quelle
Wenn wir das Kamera-Plugin für die Bildergalerie verwenden, wird die Statusleiste wieder angezeigt. Um dieses Problem zu beheben, fügen Sie bitte diese Zeile hinzu
zu
Funktion innerhalb von CVDCamera.m in der Plugins-Liste
quelle
Schreiben Sie beim Starten den folgenden Code in AppDelegate.m in das Ereignis didFinishLaunchingWithOptions .
CGRect screenBounds = [[UIScreen mainScreen] bounds]; // Fixing status bar ------------------------------- NSArray *vComp = [[UIDevice currentDevice].systemVersion componentsSeparatedByString:@"."]; if ([[vComp objectAtIndex:0] intValue] >= 7) { // iOS 7 or above CGRect newWebViewBounds = CGRectMake( 0, 20, screenBounds.size.width, screenBounds.size.height-20 ); screenBounds = newWebViewBounds; } // ------------------------------- Fixing status bar End
Und für iOS 7 und höher korrigieren.
quelle
Versuchen Sie Folgendes, um die Statusleiste im Hochformat sichtbar zu halten, sie jedoch im Querformat (dh im Vollbildmodus) auszublenden:
In
MainViewController.h
:In
MainViewController.m
:Dies ist eine Kombination aus dem, was ich in dieser und verknüpften StackOverflow-Diskussionen gefunden habe, etwas Code aus dem Cordova StatusBar-Plugin (um den 20px-Wert nicht fest zu codieren) und einigen Beschwörungsformeln meinerseits (ich bin kein iOS-Entwickler) Ich habe mich auf den Weg zu dieser Lösung gemacht.
quelle
Fügen Sie zunächst das Geräte-Plugin in Ihr Projekt ein. Die Plugin-ID lautet: org.apache.cordova.device und das Repository lautet: https://github.com/apache/cordova-plugin-device.git
Verwenden Sie danach diese Funktion und rufen Sie sie auf jeder Seite oder jedem Bildschirm auf: -
quelle
Der beste Weg, um den Hintergrund der Statusleiste zu steuern - 2017
Nach anhaltender Frustration und vielen Suchanfragen im Internet sind dies die folgenden Schritte:
Verwenden Sie den folgenden Code für onDeviceReady
Es funktioniert für mich in iOS & Android.
Viel Glück!
quelle