Xcode 7 - Constraints - equal spacing between buttons

Question

I am trying to get horizontal equal spacing between 11 buttons, I have tried with the IB but I cannot get the buttons to space equally in different screen sizes. Also I want to increase the size of the buttons and keep the ratio of each button on bigger screen.

3.5-inch

5.5-inch

I have been trying with all different constraints setup but I cannot get it right. Is this Possible to achieve and if yes How?

Answer 1

To layout 11 buttons equally spaced, put 10 spacer views between them:

---

Set the following constraints:

1. Set a Leading Space to Container View Margin constraint between the leftmost button and the left margin.
2. Set a Trailing Space to Container View Margin constraint between the rightmost button and the right margin.
3. Pin all of the buttons and spacer views to their left and right neighbors. The constant should be 0.
4. Set the height of all of the spacer views (to something like 64).
5. Set an Equal Widths constraint between the leftmost button and the top level view. Change the multiplier to 1:18. This will allow the button size to grow on bigger screens.
6. Select all 11 buttons (by holding down shift and click on the 11 buttons. Choose Equal Widths and Aspect Ratio. Make the Aspect Ratio constant 1 for square buttons.
7. Select all 10 spacer views and set Equal Widths.
8. Set a Vertical Spacing to Top Layout Guide constraint between the leftmost button and the top margin.
9. Select all 11 buttons and 10 spacer views and select Align Vertical Centers.
10. Select all 10 spacer views and set their hidden property in the Attributes Inspector.

---

On the iPhone 4S (3.5 inch):

---

On the iPhone 6S Plus (5.5 inch):

Answer 2

Use a horizontal UIStackView and set it to "fill equally"