Arbeiten mit Top Layout Guide in UIScrollView durch Auto Layout

Sie haben Recht, verwirrt zu sein. Es ist etwas kontraintuitiv, aber die oberen und unteren Layouthilfslinien sind für die Konfiguration eines UIScrollView irrelevant, so dass sein scrollbarer Inhalt die transparente Navigationsleiste überlagert, was der Effekt ist, den Sie erreichen möchten.

was zu tun ist

Angesichts der View-Hierarchie, die Sie im zweiten Bild gezeigt haben, müssen Sie dies unter iOS8 tun:

1. Konfigurieren Sie den View-Controller so, dass "Kanten unter der oberen Leiste erweitern" aktiviert ist (verwenden Sie im Code edgesForExtendedLayout ). Dadurch wird sichergestellt, dass der View-Controller seine Root-Ansicht so auslegt, dass die Navigationsleiste nicht sichtbar ist.

2. Konfigurieren Sie die Einschränkungen für die Bildlaufansicht, sodass die obere Kante der Bildlaufansicht gegenüber dem oberen Rand der Superansicht einen Null-Offset aufweist, nicht null Platz von der oberen Layout-Anleitung. Dadurch wird sichergestellt, dass die Sammlungsansicht die Stammansicht füllt und somit auch die Navigationsleiste unterschneidet, was erforderlich ist, damit der Inhalt der Bildlaufansicht unter der Navigationsleiste blättern kann. (IB könnte dich bei dieser Sache bekämpfen. Siehe Fußnote unten.)

3. Wie also stellen Sie sicher, dass die Scroll-Ansicht eine Vorstellung davon hat, wo sich die Navigationsleiste befindet, damit sie (zB) nicht immer ihren Inhalt unter dem Nav positioniert Bar? Die Antwort hat nichts mit Layout-Anleitungen zu tun. Aktivieren Sie im View-Controller das Kontrollkästchen "Scroll View Insets anpassen" (oder im Code automaticallyAdjustsScrollViewInsets ). Dies bewirkt, dass der Ansichtscontroller die Eigenschaft contentInset der Bildlaufansicht automatisch so anpasst, dass die Bildlaufansicht ihren Inhalt entsprechend positioniert.

Das wird funktionieren.

was ist los

Warum ist das die Antwort? Und warum ist es so verwirrend?

Ehrlich gesagt ist es leicht verwirrend, weil die oberen und unteren Layout-Guides als Elemente, die Layoutinformationen über transluzente überlagerte Elemente vermitteln, prominent dargestellt werden. Sie sind jedoch nicht der einzige "Transluzenz-bewusste" Layout-Mechanismus. Sie sind direkt relevant nur für die Positionierung von "normalen" Subviews, d. H. Nicht die Root-Ansicht des View-Controllers und nicht Inhalt in einem UIScrollView.

Der Inhalt innerhalb einer Bildlaufansicht (oder einer Unterklasse wie UICollectionView und UITableView) wird immer auf eine kompliziertere Weise positioniert, wobei die Bildlaufleiste die Ansicht selbst durch Eigenschaften wie contentInset , contentOffset usw. beeinflusst Wenn das Scroll-Ansichtslayout eine einfache Sache wäre, warum hätte Apple WWDC-Sitzungen für das Scroll-Layout der letzten vier Jahre eingerichtet?!)

Um zusammenzufassen, wie die obigen Schritte zeigen, sind die drei verschiedenen Transluzenz-bewussten Mechanismen zur Verwaltung des Layouts wie folgt:

1. Kanten erweitern bestimmt, ob der View-Controller seine Stammansicht so positioniert, dass die Navigationsleiste darunter liegt.

2. Layout-Hilfslinien stellen eine Metrik dar, die angibt, wo sich der Inhaltsbereich "main" befindet, wobei transparente Balken berücksichtigt werden. Sie können diese mit Auto-Layout verwenden, um normale Ansichten so zu positionieren, dass sie nicht unterlappen. Oder Sie können auf die numerischen Werte im Code zugreifen.

3. Bildlaufeinfügungen sind der richtige Weg, um sicherzustellen, dass der Inhalt einer Bildlaufansicht unterlappen kann, aber nicht immer unterlagert. Die Eigenschaft automaticallyAdjustsScrollViewInsets auf dem View-Controller kann dies in einfachen Fällen automatisch für Sie übernehmen. (Vermutlich bewirkt diese Eigenschaft, dass der View-Controller die contentInset der Bildansicht basierend auf den gleichen Werten aktualisiert, die über die Layout-Guides verfügbar sind. Wenn Sie also die Einfügungen selbst verwalten müssten, würden Sie dies tun.)

bekämpft IB's Layout Guide Mania

Eine Fußnote zu "Kampf mit IB":

Leider wird der Interface Builder möglicherweise dagegen kämpfen, wenn Sie versuchen, die Kante der Bildlaufleiste auf die Kante der Superview zu beschränken. Wenn Sie bei gedrückter Strg-Taste aus der Bildlaufansicht in den Superview ziehen, wird beim Aufrufen des Menüs mit möglichen Einschränkungen zum Hinzufügen zwischen diesen Ansichten möglicherweise versucht, die Bildlaufansicht auf die Layout-Hilfslinien des Ansichtscontrollers zu beschränken. Dies liegt daran, dass IB gedankenlos Layout-Guides bevorzugt, wenn Superview die Root-Ansicht ist. Aber wenn Sie mit einem Scrollview arbeiten, ist dies das Falsche .

Warum? Angenommen, Sie akzeptieren eine Einschränkung für den Layout-Guide. Dann erhalten Sie eine Top-Einschränkung für Ihren Scrollview, die ihn auf topLayoutGuide-64.0 beschränkt. Das -64.0 ist ein fest codierter Wert, der die exakte Höhe einer Navigationsleiste ausgleicht. Was passiert also, wenn eines Tages die Navigationsleiste nicht 64pt entspricht? Oder wenn Sie die Navigationsleiste einfach ganz ausschalten? Oder möchtest du diese Szene in einem Kontext ohne Navigationsleiste wiederverwenden? Antwort: Dann bekommst du ein kaputtes Layout.

Wie also zwingt man IB, eine Beschränkung von der Bildlaufansicht zu seiner Superview-Kante hinzuzufügen, im Gegensatz zur Layout-Anleitung? Soweit ich das beurteilen kann, ist die Antwort, dass Sie diese Einschränkung nicht korrekt in IB hinzufügen können, indem Sie eine Strg-Taste zwischen den Ansichten ziehen.

Stattdessen müssen Sie die Ansicht auswählen und dann das Steuerelement "Anheften" am unteren Rand der Zeichenfläche verwenden. Dies ist der, der aussieht wie ein großes H mit einer Kiste in der Mitte. Im oberen Bereich des Pin-Popup-Dialogfelds, dem Abschnitt mit dem kleinen Diagramm, in dem Superview-Space-Einschränkungen angezeigt werden, können Sie mithilfe der Dropdown-Steuerelemente neben den Textfeldern konfigurieren, ob die Space-Einschränkung einen Layout-Guide oder eine Superview bindet. Dies ist unten gezeigt:

Github-Link zu Demo-Projekten: Ссылка

Obwohl die Antwort von algal vor iOS 9.0 funktioniert zu haben scheint, ist sie unnötig kompliziert und geht über iOS 9.0 hinaus. Der einfachere Weg, der auch über iOS 9.0 hinausgeht und keine Interaktion mit dem automatischen Layout erfordert, besteht darin, einfach Folgendes zu tun:

1. Stellen Sie sicher, dass Adjust Scroll View Insets für den ViewController in Interface Builder aktiviert ist (oder setzen Sie automaticallyAdjustsScrollViewInsets auf true programmatisch).
2. Setzen Sie die Klasse des ViewControllers root View auf UIScrollView im Interface Builder (oder ersetzen Sie sie manuell durch eine UIScrollView im Code).

Beim Hinzufügen von Abstandsbeschränkungen zeigt Xcode keine Objekte mit negativem Abstand zu Ihrer Ansicht an. Anscheinend haben Sie eine Einschränkung für den vertikalen Abstand zwischen UIScrollView und UIView hinzugefügt. Löschen Sie diese Einschränkung, verschieben Sie die Bildlaufansicht auf unter Top Layout Guide und fügen Sie eine neue vertikale Leerraumbeschränkung zwischen UIScrollView und Top Layout Guide hinzu.