iOS equally spacing views

Question

Hi, Why is this come out this way on iPad 2 air?? I followed this.

I want the white placeholders to be smaller in width.

Answer 1

If you want all views to be equally spaced, use horizontal UIStackView and set the spacing property to equal.

Or if you want to manually do this via constraints, you have to have to set your views' width proportional to the device/superView's width.

For example, if your iPhone/iPad width is 320, if you want 4 views to be equally spaced, divide the screen width by the number of views while setting equal width constraint to the views:

320 / 4 = 80 (Width of each view)

Do the below steps for all your required views/buttons: (I am using buttons for example purpose)

This is where we begin:

Step1:
Set Top and Leading constraints of your Button1 to its superview like this:

Step 2:

Make your button Equal Width and Equal Height of its superview.

Step 3:

Now your button would apparently be of same size as your super view. Here comes the fun and easy part. Make your button's width 1/4th (If you have 6 views that needs to be equally spaced, make it 1/6) of your superview's width by editing the constraint.

Step 4:

Apply constraints from previous steps to all the views/buttons and update frames to see the change.

These are the constraints for the first button for your reference: