pasek stanu iOS 7 nakładający się interfejs użytkownika

W MainViewController.m inside: - (void)viewWillAppear:(BOOL)animated add this:

//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;
    }

Więc funkcja końcowa będzie wyglądała tak:

- (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];
}

To, co zwykle robię, to dodawanie dwóch właściwości wartości klucza do pliku Info.plist.

Kod źródłowy właściwości to:

Mam problem z otwarciem przeglądarki inApp za pomocą phonegap. Poprawka Gimi działa dobrze, ale za każdym razem, gdy otwierałem przeglądarkę inApp, ekran był kurczony na dole. Dodałem więc instrukcję if, aby sprawdzić, czy pochodzenie y webview wynosi 0. Przeglądarka inApp nie ma już y origin 0, więc rozwiązała mój problem.

// 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];
}

Rozwiązanie nie jest naprawdę moje, ale nie mogę znaleźć źródła. Mam nadzieję, że to pomoże!

Umieść ten fragment kodu w swoim pliku MainViewController.m w projekcie 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);
        } 
    } 
}

Używam tego kodu w metodzie ViewDidLoad.

 if ([self respondsToSelector:@selector(edgesForExtendedLayout)])
 {
    self.edgesForExtendedLayout = UIRectEdgeNone;
 }

Działa to również podczas próby obsługi poprzednich wersji iOS.

Właściwie, znalazłem odpowiedź Gimi za najlepszą odpowiedź, i szukałem dużo! Aby dodać do odpowiedzi Gimi, a także odpowiedzieć ignacio-munizaga na tę odpowiedź, kod będzie wykonywany za każdym razem, gdy pojawi się widok, co oznacza, że po zamknięciu wbudowanej przeglądarki, lub po rolce aparatu itp. więc po prostu umieścić wartość bool stwierdzając, czy rozmiar został już dostosowany.

Końcowy kod wygląda następująco:

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];
}

Spróbuj wejść do pliku (app name)-Info.plist aplikacji w XCode i dodaj klucz

view controller-based status bar appearance: NO
status bar is initially hidden : YES

Jeśli twój rozwój dla iOS 7 nie polecam owijania paska stanu w czarny prostokąt stary styl iOS. Po prostu Zintegruj go z projektem, aby uzyskać bardziej" pełnoekranowy " wygląd iOS 7.

Możesz użyć tej wtyczki, aby dostosować kolor atramentu paska stanu, lub ukryć go lub pokazać w dowolnym momencie aplikacji.

Https://github.com/jota-v/cordova-ios-statusbar

Metody js to:

window.plugins.statusBar.hide();
window.plugins.statusBar.show();
window.plugins.statusBar.blackTint();
window.plugins.statusBar.whiteTint();

Ważne: również w pliku plist aplikacji Ustawić UIViewControllerBasedStatusBarAppearance aby NIE .

Lepiej mieć to w info.plist

<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

To sprawia, że w ogóle nie ma paska stanu.

Aby rozwiązać problem paska stanu iOS7, możemy użyć następującego kodu do Cordova / PhoneGap:

function onDeviceReady() {
    if (parseFloat(window.device.version) === 7.0) {
          document.body.style.marginTop = "20px";
    }
}

document.addEventListener('deviceready', onDeviceReady, false);

W każdym razie Cordova 3.1 wkrótce naprawić, że to i inne problemy dla iOS7.

 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);
    }

From Apple iOS7 transition Guide ,

W szczególności,

self.automaticallyAdjustsScrollViewInsets = YES;
self.edgesForExtendedLayout = UIRectEdgeNone;

Działa dla mnie, gdy nie chcę się nakładać i mam UITableViewController.

Jeśli używasz Cordova z Sencha Touch i używasz normalnego Sencha Touch nawigacja / paski tytułu, można po prostu rozciągnąć navbar I zmienić położenie zawartości w navbar tak wygląda w domu na iOS 7. Po prostu dodaj to do app.js (po ostatniej linii 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;");
}

(Źródło: http://lostentropy.com/2013/09/22/ios-7-status-bar-fix-for-sencha-touch-apps/)

Wpisz następujący kod wewnątrz AppDelegate.m in didFinishLaunchingWithOptions event (dokładnie przed ostatnią linijką kodu " return YES;" ) :

if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) 
{
    [application setStatusBarHidden:YES withAnimation:UIStatusBarAnimationNone];
}

W .właściwość plist file set:

<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

Ukrywa pasek stanu.

Najlepszym rozwiązaniem jest zmiana rozmiaru głównego widoku, szczególnie jeśli aplikacja używa stopki.

Na MainViewController.m przy użyciu metody viewDidLoad, po [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];
}

Wtedy nie będziesz musiał modyfikować żadnego javascript do swojej aplikacji

Wraz z wydaniem iOS 7.0.4, poprawka iOS7 zepsuła się w moim obecnym projekcie, ponieważ 7.0.4 działa bez poprawki. Dodano więc kontrolkę minor, aby po prostu ją uruchomić, jeśli działa minor release 3 lub mniej.

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];
}

Zacząłem podążać tą trasą, ale mam własną kontrolę nawigacji z core view, którą wsuwam do ramki, która zwykle owija rdzeń wspólnym paskiem tytułu i tabbar; nie storyboard, nie UINavigationController.

Szybko zaczęło się to komplikować, dodając i odejmując 20 pikseli paska stanu. Potem objawienie.

Zrobiłem kopię .xib file, powiedziałem Xcode, aby pokazać mi go jako układ iOS 7, wyrównałem wszystko i umieściłem pojedynczy przełącznik 6/7 w kodzie .. wszystko działa natychmiast racja, a dodatkowe zasoby dodają tylko 8K do zestawu.

Możemy to również sprawdzić w naszych plikach js

if (parseFloat(window.device.version) >= 7.0) {

    $("body").addClass("ios7");
}

W .plik css definiuje klasę dla tego

 .ios7 .ui-page, .ios7 .ui-header, .ios7 .ui-pane {
     margin-top: 17px !important;
  }

Najpierw rozwijam dla iOS7, ale aby zachować kompatybilność z iOS6 robię dokładnie odwrotnie niż sugerował Gimi-w MainViewController.m ustawiam y origin 20px w górę i zwiększam wysokość widoku o 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;
}

Wielkie dzięki, stary. Działa dobrze na:

MAC OS X 10.9.1 - Xcode 5.0.2 - cordova 3.3 - jQuery mobile 1.3.2.

Oto moje podejście do CSS i Javascript:

1) Zdefiniuj następujące elementy w CSS:

#ios7-statusbar-fix {
    width:100%;
    height:20px;
    background-color:white;
    position:fixed;
    z-index:10000;
    margin-top:-20px;
    display:none;
}

2) Dodaj div-container o tym id jako pierwszy element po <body> - tag:

<body>
    <div id="ios7-statusbar-fix"></div>
…

3) Filtruj Urządzenia z systemem iOS 7 i stosuj zmiany za pomocą 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';
}

Niektóre z powyższych odpowiedzi dadzą ci czarny pasek na górze, jeśli ustawisz ekran związany 20px, inne będą zmniejszać ekran widoku sieci Web, jeśli używasz widoku sieci Web.rama.rozmiar.height-20px; Spróbuj tego, działa na każdym ios i nie musisz zmieniać css, włóż do środka

- (void)webViewDidFinishLoad:(UIWebView*)theWebView {

/ / is it IOS7 and up

if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {

/ / Pobierz rozmiar ekranu urządzenia

    CGRect screenBounds = [[UIScreen mainScreen] bounds];

//zmniejsz wysokość o 20px

    int x= screenBounds.size.height -20;

/ / ustaw webview top pos 20px tak, aby znajdował się pod paskiem stanu i zmniejsz rozmiar by 20px

    [theWebView setFrame:CGRectMake(0, 20, theWebView.frame.size.width, x )];

}

Dla iPhoneX

Dla wszystkich powyższych odpowiedzi:

Wysokość paska stanu w iPhoneX jest 44 a nie 20