2

I have a Vertical UIStackView with 7 elements inside. These elements are not collectively tall enough to fill the entire view, so they get spaced based on the distribution value. I would like the arranged views to stack at the top of the view, with no space at the top and empty space at the bottom. I would also like to be able to control the spacing below each view as well, if possible.

I have tried every available distribution option, none of them accomplish what I'm trying to do. Help is appreciated!

Update: Adding an image of my desired result to make it easier to understand

enter image description here

  • The views have variable heights (no problem, I have this working)
  • The views should appear in the order I add them (also working)
  • The functionality I want is this: The first view is anchored to the top of the stack view, the second view is anchored to the bottom of the first view, etc.
Connor Hicks
  • 755
  • 2
  • 8
  • 25

1 Answers1

6

Have you tried using a stack view that embeds another stack view and an empty view. This could give you the results that you require. Create your view hierarchy this way.

Stackview Stackview FirstView SecondView ThirdView .... SeventhView PaddingView

By embedding your 7 views inside a stack view and then use a padding view and then embed the first stack view and the padding view inside another stack view you could achieve all the things that you want.

Pradeep K
  • 3,671
  • 1
  • 11
  • 15
  • What distribution settings would I put on the outer Stack View? Fill Proportionally? – Connor Hicks Mar 14 '16 at 14:05
  • Yes. The inner stack view will have a specific height based on how you have distributed the views inside that stack view. The remaining space will be used for the padding view and so outer stack view can use the fill proportionally setting – Pradeep K Mar 14 '16 at 14:13
  • It seems that the inner stack view is still taking up the full available space rather than snapping to the size of its arrangedSubviews, thus the padding view has no size and the layout essentially stays the same. How can I force the inner stack view to shrink to the size of its' contents? @Pradeep K – Connor Hicks Mar 14 '16 at 14:47
  • Set the distribution of the inner stack view to Fill Proportional. First you have to create the 7 subviews as per your requirements. Then select all of them and embed in stack view. Now it will set the stack view according to the total height of your subviews. Now add another view below that stack view and select that stack view and the padding view and embed it inside another stack view. Set the distribution to proportional again. The key is to create the views according to the required heights and then embed them in the stack view. – Pradeep K Mar 14 '16 at 15:03