Articles

UIScrollView autolayout op een storyboard. Een stap-voor-stap handleiding.

  1. We beginnen met het toevoegen van een UIScrollView aan het hoofdaanzicht (dat kan het hele aanzicht zijn of een ander, klein aanzicht, dat je hebt. Hoe dan ook, vanaf nu zal ik daarnaar verwijzen als de ‘main view’) en voegen we top, bottom, left en right constraints toe.

Top, Bottom, Left and Right Constraints (met betrekking tot de main view)

2. Daarna voegen we een UIView toe binnen de UIScrollView (deze view is een essentiële stap om de autolayout correct te laten werken). Ik noemde het ‘Content View’ en voegde boven, onder, links en rechts constraints toe met betrekking tot de scroll view. Daarnaast heb ik ook gelijke hoogtes en breedtes toegevoegd ten opzichte van het hoofdscherm.

Top, Bodem, Left and Right Constraints (met betrekking tot de scrollview)

Equal Widths and Heights (met betrekking tot de hoofdview)

3. De volgende stap hangt af van of u verticaal of horizontaal wilt scrollen. Als u verticaal wilt scrollen, moet u de prioriteit van de ‘Equal Heights Constraint’ instellen op 250. Als u daarentegen een horizontale scroll wilt, moet u de prioriteit ‘Equal Widths Constraint’ instellen op 250.

Maakt een verticale scroll mogelijk.

Hiermee kunt u horizontaal scrollen.

4. De scrollweergave is nu helemaal ingesteld en klaar voor gebruik! U kunt nu beginnen met het toevoegen van uw inhoud, maar u moet er wel rekening mee houden dat de hoogte van de ‘Content View’ niet dubbelzinnig mag zijn. Dit betekent dat elke view een hoogtebeperking moet hebben (hoogte gelijk aan X of minder of gelijk aan X) en dat alle componenten (of tenminste een ononderbroken lijn van componenten van boven naar beneden) verticale tussenruimten moeten hebben.

Verder moeten de bovenste en onderste componenten respectievelijk een boven- en een onderafstand hebben tot de ‘Content View’.

5a) Vertical ScrollView – Component setup voorbeeld