iOS: Wie implementiere ich eine Stack View in einer Scroll View?

Posted . Visible to the public.

Zuerst fügt man eine Scroll View mit einem Frame in der Größe des Bildschirms hinzu.

scrollView = UIScrollView(frame: view.bounds)
scrollView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
scrollView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(scrollView)

Die Konstanten der Leading-, Trailing, Top- und Bottom-Constraints werden auf 0 zur Superview gesetzt. Anschließend erstellt man eine Container View, die eine Subview der Scroll View ist und eine Stack View, die eine Subview der Container View ist.

let stackView = UIStackView()
stackView.axis = UILayoutConstraintAxis.vertical
stackView.distribution = UIStackViewDistribution.equalSpacing
stackView.alignment = UIStackViewAlignment.leading
stackView.spacing = 0
stackView.translatesAutoresizingMaskIntoConstraints = false
container.addSubview(stackView)

Die Container View erhält die gleiche Höhe und Breite wie die Superview, wobei der Height-Constraint eine niedrige Priorität von 250 bekommt.

let constraint = NSLayoutConstraint(item: container, attribute: .height, relatedBy: .equal, toItem: self.view, attribute: .height, multiplier: 1, constant: 0)
constraint.priority = 250

Die Konstanten der Leading-, Trailing, Top- und Bottom-Constraints der Container View werden ebenfalls auf 0 zur Scroll View gesetzt. Die Stack View hat einen Leading-, Trailing, Top- und Bottom-Constraint mit Konstante 0 zur Container View.
Jetzt können Elemente zur Stack View hinzugefügt werden. Diese benötigen nur noch Leading- und Trailing-Constraints.
Möchte man einen bestimmten Abstand zwischen den Elementen, hilft es leere Views als Platzhalter zu verwenden.

Profile picture of Marlene
Marlene
Last edit
Marlene
Keywords
stackview, scrollview
Posted by Marlene to Appdafuer (2018-09-17 13:46)