4

I'm starting a new project that supports iOS9 upwards and after looking at Apple's constraint guidelines they appear to suggest using StackViews whenever possible. After reading a few articles and the apple documentation I've a basic understanding of how to create them and their benefits but I'm still not sure when not to use them and how to arrange them.

For example in the below view should I use:

  1. One big StackView on a vertical axis that covers the entire super view.
  2. Three StackViews with regular constraints pinning them to each other and the super view.
  3. One big StackView that covers the entire super view with three stack views within that view
  4. No StackViews, this view isn't suitable

In general how do I decide how I layout my stackviews and whether to use them?

Example View

Declan McKenna
  • 4,321
  • 6
  • 54
  • 72

2 Answers2

2

I've started to use stack views more and more, especially since Xcode 8.x. Every stack view you add saves you adding some auto layout constraints (3 vertically stacked labels in a view would probably need 9 constraints, that could be just 3 with a stack view)

If all elements are in vertical stack views, it's unlikely you'd need to embed one inside another - you'd usually do that when you have a horizontal one inside a vertical, or vice-versa. So in the example above, I'd start with one large stack view.

In Xcode 7.x there were issues with the intrinsic sizes of UILabels not being calculated correctly. In these cases, you can set a placeholder intrinsic size for each label in the size inspector.

That problem aside, get stacking!

Ashley Mills
  • 50,474
  • 16
  • 129
  • 160
  • For my example above the issue I'm having with StackViews is that the distances between each view are not equal. The space between the 2nd and 3rd along with the 4th and 5th view down are larger in the design I've been given. – Declan McKenna Mar 08 '17 at 13:17
  • If you need to add extra spacing, you can drop an empty UIView, and set it's height constraint – Ashley Mills Mar 08 '17 at 14:01
  • I think this view may not be suitable if the aim is to minimise constraints. I no longer need the three constraints between the 1st/2nd, 3rd/4th, 5th/6th views, and won't needs trailing/leading constraints for the collection views that take up on the stackviews width but I must add two new views which will need 3 constraints each (leading trailing, height) and will need three constraints for the StackView itself for a net gain of 3 additional constraints. – Declan McKenna Mar 15 '17 at 10:38
  • If the views had equal size, spacing, or leading/trailing constraints I can see this minimising my constraints but as all these things are different it appears this adds complexity rather than takes it away. – Declan McKenna Mar 15 '17 at 10:41
1

I have a problem and can't see your screenshot but I have some points that help you decide:

  • Do use stack views for all linear arranged views
  • I prefer set the root stack view to the size that contains exactly the content without whitespace (so constraint it to be as the superview size only if that's the content size)
  • The stack view uses auto layout to determine the size of it's subviews, so you should validate that your subviews do tell their best suitable size - maybe by using intrinsicContentSize() [only when needed!] (be careful with it)
  • you can practice stack views in interface builder, try to change stack view properties, hide subviews (with hidden property), and play with constraints, it's great!

Good luck =] Have a nice play

Yitzchak
  • 3,303
  • 3
  • 30
  • 50