So fügen Sie führende Anzeigen zur Ansicht hinzu, die in einer UIStackView hinzugefügt wurden


125

Dies ist mein Setup: Ich habe eine UIScrollViewmit führende, obere Testkante auf 0 gesetzt. Darin füge ich eine UIStackViewmit diesen Einschränkungen hinzu:

stackView.centerYAnchor.constraintEqualToAnchor(selectedContactsScrollView.centerYAnchor).active = true  
stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

In der Stapelansicht füge ich einige Ansichten hinzu.
Mein Problem ist, dass aufgrund der Einschränkungen die erste Ansicht, die der Stapelansicht hinzugefügt wird, auch die Vorderkante = 0 hat.

Wie kann ich der ersten Ansicht etwas Polster hinzufügen? Ohne die Einschränkungen der Bildlaufansicht anzupassen.


2
Würden Sie die akzeptierte Antwort ändern? Tolgas Antwort scheint viel besser zu sein.
Honig

Antworten:


26

Die von Ihnen bereitgestellte Lösung fügt keine Auffüllung für Ihre Ansichten in Ihrem UIStackView hinzu (wie Sie es in der Frage wollten), sondern fügt einen Hinweis für das UIStackView hinzu.

Eine Lösung könnte darin bestehen, eine weitere UIStackView in Ihre ursprüngliche UIStackView einzufügen und die Führung zu dieser neuen UIStackVIew zu geben. Fügen Sie dann Ihre Ansichten zu dieser neuen UIStackView hinzu.

Hinweis, Sie können dies vollständig mit Interface Builder tun. Mit anderen Worten, Sie müssen keinen Code dafür schreiben.


373

Wenn die isLayoutMarginsRelativeArrangementEigenschaft true ist, werden in der Stapelansicht die angeordneten Ansichten relativ zu den Layouträndern angeordnet.

stackView.layoutMargins = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
stackView.isLayoutMarginsRelativeArrangement = true

Es wirkt sich jedoch auf alle angeordneten Ansichten innerhalb der Stapelansicht aus. Wenn Sie diese Auffüllung nur für eine angeordnete Ansicht wünschen, müssen Sie verschachtelt verwendenUIStackView


2
isLayoutMarginsRelativeArrangementist ein Getter, Setter ist layoutMarginsRelativeArrangement. Ich kann die Antwort nicht bearbeiten
Maross

5
@maross Es gibt keinen Unterschied zwischen Getter- und Setter-Funktion in Swift. Aber Sie haben Recht, Leute, die sich mit Objective-C entwickeln, sollten layoutMarginsRelativeArrangementstattdessen verwenden. Offizielle Dokumentation: developer.apple.com/reference/uikit/uistackview/…
Tolga Okur

3
Für Ziel-C:stackView.layoutMargins = UIEdgeInsetsMake(0, 20, 0, 20); [stackView setLayoutMarginsRelativeArrangement:YES];
Snouto

4
Februar 2019, um Mitternacht im Büro sitzen - Antworten wie diese geben mir die Kraft, vorwärts zu kommen. Danke @tolpp
nefarianblack

155

Ich habe festgestellt, dass Einschränkungen in einer Stapelansicht nicht funktionieren oder etwas seltsam erscheinen.

(Zum Beispiel, wenn ich der in der Bildstapelansicht ausgewählten Einschränkung eine führende / nachfolgende Einschränkung hinzufüge, die auch der Sammlungsansicht eine führende, aber keine nachfolgende Einschränkung hinzufügt; und dies ist mit Sicherheit ein Konflikt).

Stackview in Stackview

Wählen Sie Folgendes aus, um Layoutränder für alle Ansichten in der Stapelansicht festzulegen:

Stack View > Size Inspector > Layout Margins > Fixed

Hinweis: Die "Fixed"Option wurde früher aufgerufen "Explicit", wie in den Screenshots gezeigt.

Fügen Sie dann Ihre Polsterung hinzu:

Storyboard


23
eines der Dinge, die Apple versteckt. Ich hasse es, wie Xcode das Gegenteil von gut, freundlich und einfach ist. Danke
Ente

Xcode stürzt immer wieder ab, wenn ich diese expliziten Layoutränder ändere. Hat einen Fehler gemeldet, aber sie haben geantwortet, dass es sich um ein Duplikat handelt.
Mvandillen

Das konnte ich in der Benutzeroberfläche nicht finden. Ändern Sie die Layoutränder in Explizit, um die Felder für die Stapelansichtsränder anzuzeigen.
pkamb

13
FYI XCode 9 nennt dies jetzt "Fixed" anstelle von "Explicit".
Mel

Deaktivieren Sie in Xcode 9 im Dateiinspektor das Kontrollkästchen "Layouts für sichere Bereiche verwenden", was zum Zeitpunkt des Schreibens in IB immer noch viele Probleme verursacht, und halten Sie sich für Ihre Einschränkungen an die normalen Layout-Anleitungen.
PJ_Finnegan

16

Was für mich funktioniert hat, ist, der Stapelansicht eine weitere UIView hinzuzufügen, die nur ein Abstandshalter ist (funktioniert zumindest mit stackView.distribution = .Fill):

let spacerView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 10))
stackView.addArrangedSubview(spacerView)
stackView.addArrangedSubview(viewThatNeedsSpaceBeforeIt)
stackView.addArrangedSubview(NextView)...

6

schnell 3: Sie müssen nur den Versatz einstellen um:

firstView.leadingAnchor.constraint(equalTo: parentView.leadingAnchor, constant: 200).isActive = true

Stellen Sie sicher, dass diese Einschränkung nach Ihnen festgelegt wurde parentView.addArrangdSubView(firstView)


4

Wenn Sie nur eine führende Auffüllung benötigen, können Sie die Ausrichtung der Stapelansicht auf "Nachlauf" setzen und dann für jede der enthaltenen Unteransichten eindeutige führende Einschränkungen festlegen.

Als Bonus können Sie auch die Ausrichtung der Stapelansicht auf "Mitte" setzen und dann die Einschränkungen "Führen" und / oder "Nach" verwenden, um jedem Element auf beiden Seiten eine eigene Polsterung zu geben.


1

Diese Frage hat bereits gute Antworten. Ein Vorschlag: Verwenden Sie die spacingEigenschaft, um den Abstand zwischen den Ansichten festzulegen. Für die erste und die letzte Ansicht gibt es zwei Optionen: Setzen Sie entweder Einfügungen wie von @tolpp vorgeschlagen oder fügen Sie eine Einschränkung hinzu, die dem übergeordneten Element (Stapelansicht) mit einer Konstante zum Hinzufügen von Auffüllungen zugeordnet ist.


0

Wir haben transparente Komponenten (z. B. UIButton / UIView) als erstes und letztes untergeordnetes Element von UIStackView hinzugefügt. Stellen Sie dann die Breite dieser unsichtbaren untergeordneten Elemente ein, um die Polsterung anzupassen.


0

Die Lösung wäre, eine reguläre Ansicht in der Stapelansicht zu haben, die alle Ansichten enthält, denen Sie Einschränkungen hinzufügen möchten, und dann können Sie Einschränkungen für Ihre Elemente hinzufügen, die relativ zu den Ansichten in der Stapelansicht sind. Auf diese Weise können Ihre ursprünglichen Ansichten in der Stapelansicht führende und nachfolgende Einschränkungen aufweisen.

Dies kann im Interface Builder und programmgesteuert erfolgen.


-3

Es scheint, dass die Lösung ziemlich einfach war. Anstatt:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

Ich habe gerade geschrieben:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor, constant: 15).active = true

1
Tatsächlich fügt Ihr Code einen Hinweis für die Uistackview in der Urscrollview hinzu. Er fügt keine Auffüllung für Ihre Ansichten in Ihrer Uistackview hinzu (wie in der Frage angegeben)
William Kinaan

Ja, aber ich weiß nicht, ob Sie Polster hinzufügen können, also wird dies für mich funktionieren.
Adrian

Als ersten Gedanken können Sie eine andere Uistackview in Ihre ursprüngliche Uistackview einfügen und ihr die Polsterung geben. Fügen Sie dann Ihre Ansichten zu dieser neuen Uistackview hinzu (Sie können dies vollständig mit dem Interface Builder tun, ohne Code dafür schreiben zu müssen)
William Kinaan

Ja, das wird funktionieren. Sie können als Antwort hinzufügen und ich werde es akzeptieren.
Adrian
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.