Statusleiste und Navigationsleiste erscheinen über den Grenzen meiner Ansicht in iOS 7

Question

Ich habe kürzlich Xcode 5 DP heruntergeladen, um meine Apps in iOS 7 zu testen. Das erste, was mir aufgefallen ist und bestätigt habe, ist, dass der Rahmen meiner Ansicht nicht immer für die Statusleiste und die Navigationsleiste angepasst wird.

In viewDidLayoutSubviews drucke ich den Rahmen der Ansicht:

{{0, 0}, {320, 568}}

Dadurch erscheint mein Inhalt unterhalb der Navigationsleiste und der Statusleiste.

Ich weiß, dass ich die Höhe selbst berücksichtigen könnte, indem ich die Höhe des Hauptbildschirms bekomme, die Höhe der Statusleiste und die Höhe der Navigationsleiste abziehe, aber das scheint wie unnötige zusätzliche Arbeit.

Wie kann ich dieses Problem beheben?

Update:

Ich habe eine Lösung für dieses spezifische Problem gefunden. Setze die Transluzenz-Eigenschaft der Navigationsleiste auf NEIN:

self.navigationController.navigationBar.translucent = NO;

Dadurch wird verhindert, dass die Ansicht unterhalb der Navigationsleiste und der Statusleiste gerahmt wird.

Ich habe jedoch keine Lösung für den Fall gefunden, wenn Sie möchten, dass die Navigationsleiste transluzent ist. Zum Beispiel, wenn Sie ein Foto im Vollbildmodus anzeigen, möchte ich die Navigationsleiste transluzent haben und die Ansicht darunter gerahmt haben. Das funktioniert, aber wenn ich die Anzeige der Navigationsleiste ein- und ausschalte, habe ich noch seltsamere Ergebnisse erlebt. Der erste Unterblick (ein UIScrollView) ändert jedes Mal seinen Ursprung.

Answer 1

Sie können dies erreichen, indem Sie eine neue Eigenschaft namens edgesForExtendedLayout im iOS7 SDK implementieren. Fügen Sie bitte folgenden Code hinzu, um dies zu erreichen,

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

Sie müssen das oben genannte in Ihrer Methode -(void)viewDidLoad hinzufügen.

iOS 7 bringt mehrere Änderungen in Bezug darauf, wie Sie das Layout und das Erscheinungsbild Ihrer UI anpassen. Die Änderungen im Layout des View-Controllers, der Farbe der Einfärbung und der Schriftart betreffen alle UIKit-Objekte in Ihrer App. Darüber hinaus ermöglichen Verbesserungen bei den APIs für Gestenerkennung eine feinere Steuerung der Gesteninteraktionen.

Verwendung von View Controllern

In iOS 7 verwenden View Controller ein Full-Screen-Layout. Gleichzeitig bietet iOS 7 eine genauere Steuerung darüber, wie ein View Controller seine Ansichten anordnet. Insbesondere wurde das Konzept des Full-Screen-Layouts verfeinert, um einem View Controller die Spezifizierung des Layouts jeder Kante seiner Ansicht zu ermöglichen.

Die View-Controller-Eigenschaft wantsFullScreenLayout ist in iOS 7 veraltet. Wenn Sie derzeit wantsFullScreenLayout = NO angeben, kann der View Controller den Inhalt an einer unerwarteten Bildschirmposition anzeigen, wenn er unter iOS 7 ausgeführt wird.

Um anzupassen, wie ein View-Controller seine Ansichten anordnet, stellt UIViewController die folgenden Eigenschaften bereit:

• edgesForExtendedLayout

Die Eigenschaft edgesForExtendedLayout verwendet den Typ UIRectEdge, der jede der vier Kanten eines Rechtecks angibt, zusätzlich zur Angabe von none und all. Verwenden Sie edgesForExtendedLayout, um anzugeben, welche Kanten einer Ansicht erweitert werden sollen, unabhängig von der Balkentransparenz. Standardmäßig ist der Wert dieser Eigenschaft UIRectEdgeAll.

• extendedLayoutIncludesOpaqueBars

Wenn Ihr Design undurchsichtige Balken verwendet, verfeinern Sie edgesForExtendedLayout, indem Sie auch die Eigenschaft extendedLayoutIncludesOpaqueBars auf NEIN setzen. (Der Standardwert von extendedLayoutIncludesOpaqueBars ist NEIN.)

• automaticallyAdjustsScrollViewInsets

Wenn Sie nicht möchten, dass die Inhaltsinhalte eines Scroll-Views automatisch angepasst werden, setzen Sie automaticallyAdjustsScrollViewInsets auf NEIN. (Der Standardwert von automaticallyAdjustsScrollViewInsets ist JA.)

• topLayoutGuide, bottomLayoutGuide

Die Eigenschaften topLayoutGuide und bottomLayoutGuide geben die Position der oberen oder unteren Balkenkanten in der Ansicht eines View Controllers an. Wenn Balken die oberen oder unteren Teile einer Ansicht überlappen sollen, können Sie mit Hilfe des Interface Builders die Ansicht relativ zum Balken positionieren, indem Sie Einschränkungen zum unteren Teil des topLayoutGuide oder zum oberen Teil des bottomLayoutGuide erstellen. (Wenn keine Balken die Ansicht überlappen sollen, ist der untere Teil des topLayoutGuide gleich dem oberen Teil der Ansicht und der obere Teil des bottomLayoutGuide gleich dem unteren Teil der Ansicht.) Beide Eigenschaften werden bei Bedarf faul erstellt.

Bitte schauen Sie hier nach, Apple Dokumentation

Answer 2

Sie müssen nicht berechnen, wie weit alles verschoben werden muss, es gibt eine integrierte Eigenschaft dafür. Markieren Sie in Interface Builder Ihren Ansichtscontroller und navigieren Sie dann zum Attributinspektor. Hier sehen Sie einige Kontrollkästchen neben den Worten "Extend Edges". Wie Sie in der ersten Abbildung sehen können, ist die Standardauswahl, dass der Inhalt unter den oberen und unteren Leisten erscheint, aber nicht unter undurchsichtigen Leisten, weshalb das Festlegen des Leistenstils auf nicht transparent für Sie funktioniert hat.

Wie Sie in der ersten Abbildung etwas erkennen können, verbergen sich unter der Navigationsleiste zwei UI-Elemente. (Ich habe in IB Drahtgitter aktiviert, um dies zu veranschaulichen) Diese Elemente, ein UIButton und ein UISegmentedControl, haben beide ihren "y"-Ursprung auf null gesetzt, und der Ansichtscontroller ist darauf eingestellt, Inhalte unterhalb der oberen Leiste zuzulassen.

In dieser zweiten Abbildung sehen Sie, was passiert, wenn Sie das Kontrollkästchen "Unter oberen Leisten" abwählen. Wie Sie sehen können, wurde die Ansicht des Ansichtscontrollers entsprechend nach unten verschoben, damit ihr y-Ursprung direkt unter der Navigationsleiste liegt.

Dies kann auch programmatisch durch die Verwendung von -[UIViewController edgesForExtendedLayout] erreicht werden. Hier ist ein Link zu dem Klassenreferenz für edgeForExtendedLayout und für UIRectEdge

[self setEdgesForExtendedLayout:UIRectEdgeNone];

Answer 3

Ich habe meine Ansicht programmatisch erstellt und das hat für mich funktioniert:

- (void) viewDidLayoutSubviews {
    // funktioniert nur für iOS 7+
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7.0) {
        CGRect viewBounds = self.view.bounds;
        CGFloat topBarOffset = self.topLayoutGuide.length;

        // bringt die Ansicht unter die Statusleiste (iOS 6 Stil)
        viewBounds.origin.y = topBarOffset * -1;

        // verkleinert die Grenzen Ihrer Ansicht, um den Versatz auszugleichen
        viewBounds.size.height = viewBounds.size.height + (topBarOffset * -1);
        self.view.bounds = viewBounds;
    }
}

Quelle (im Abschnitt topLayoutGuide auf Seite 39 unten).

Answer 4

Swift 3 / Swift 4 Lösung, die auch mit NIBs/XIB-Dateien in iOS 10+ funktioniert:

override func viewDidLoad() {
    super.viewDidLoad()

    edgesForExtendedLayout = []
}

Answer 5

Wenn Sie möchten, dass die Ansicht die transparente Navigationsleiste hat (was recht schön ist), müssen Sie ein contentInset oder ähnliches einrichten.

So mache ich das:

// Überprüfen, ob wir auf iOS 7 laufen
if([[[[UIDevice currentDevice] systemVersion] componentsSeparatedByString:@"."][0] intValue] >= 7) {
      CGRect statusBarViewRect = [[UIApplication sharedApplication] statusBarFrame];
      float heightPadding = statusBarViewRect.size.height+self.navigationController.navigationBar.frame.size.height;

      myContentView.contentInset = UIEdgeInsetsMake(heightPadding, 0.0, 0.0, 0.0);
}