I want to have 15 buttons equally spaced between them and correctly leading and trailing the superview vertically. I set constraints so that the left set of buttons aligns to the left margin and the right set aligns to the right margin. The first button leads from the top margin in each set, and the remaining buttons each have a constraint for vertical space set to the upper neighbor. I thought this would be enough to make it work but it wasn't. As you can see, for an iPhone 4, the number of buttons displayed on the screen is only 12 so I would definitely need to somehow dynamically change the button size depending on the screen size. I am attaching a screenshot from the storyboard that shows the Any x Any
editor view and a preview for the 3.5-inch screen.
Select Layer > New > Group Layer.
To get this, open the storyboard, click the 'assistant' editor, click the 'assistant editor menu button' (immediately to the right of the > arrow at the top left of the assistant window) and select Preview. This shows how the ViewController will look in landscape/portrait 568/480 high modes.
"Main. storyboard" is the actual name of the storyboard file. This file is similar to your source code files, in that it is "compiled" into another file when you build your app in Xcode.
This was really easy to accomplish using stack views. Simply select all the buttons and click the leftmost icon (bottom right side of left pane) which is named Stack, and see the magic happening!
Try to set the constraints like this:
First select the all elements on left side and give leading constraint:
Now select first element and give top constraint:
Now select the second element and select it , and drag it to first element and give vertical spacing: , repeat giving vertical spacing for all the elements, So that each element will be vertical space constrained with its top element!!.
Do the same for elements on right side.
Give the trailing constraints for all elements on left,
and the select top element and give top constraint
and then select one element below top element and give vertical spacing between those two, repeat it for all the elements!!! So that each element will be vertical space constrained with its top element!!
Note: I only gave left constraints, you can try for right side too!!!!!
Add height constrain to the top left button to be 1/15
of the superview height and for all buttons let their height equal to the top left one.
Note it will work only if the vertical spacing is zero between buttons.
If you have a vertical space value for example x
, then set it as 1/15
- 14 * x
Note #2 in iOS 9 only, seems the stack view will help perfectly in that
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With