How do I centre/center multiple objects vertically and horizontally in XCode's interface builder?

Question

So I've set up my constraints:

In each device these objects are displaying as expected.

iPhone:

iPad:

But not I'd like to control how high up or low down these objects are from the top or bottom of the screen or just centre them. You can see from my screen shot they're not centred horizontally.

What I've tried:

When I try to centre them I keep getting those annoying yellow warnings. I even tried to add a view and put the objects inside the view and setup the constraints then centre that view. I still got errors.

How do I do this correctly?

Answer 1

Had a bit more time so i thought I would explain it a little better

1) Select the button / thing you want to position, in my image below it's a button called actions which I want to place to the right someway down the screen

2) click align from the buttons at the bottom right

3) choose align "horizontal centre in container" or vertical depending on whether you want to position it vertically or horizontally

The screen will look something like this, ignore all the complaints in yellow we will fix them later

4) Choose the newly created constraint from the buttons "size inspector" on the right, select it and edit it

5) At the top choose the "first item" and select "reverse first and second item" from the pull down menu

6) Then choose what part of the button you want to align ie leading edge / middle so far the right side of xcode should look something like this:

the super view has to still be:

superview.centre X

7) then you can set the multiplier to divide the screen equally or to a percent, ie 0.5 / 1 / 1.5 - quarter way across screen, halfway, 3/4 way across

You see the number on the yellow constraint has changed

If you change the multiplier again

The number will change

Don't worry that the button hasn't moved, that all happens when you update the view select the main view and then select "update all frames in view" from the bottom right update menu

Don't worry if everything else on the screen goes wrong whats important is your button is positioned correctly in this case horizontally in the view (you can at this point do an undo and go back to the point before the update, make a change to the constraint and then update again, then undo and tweak and go round like this until you have it perfect)

Now I will go back and apply the same method to the vertical alignment and then the same to each button in the view

The important thing is you can set your button position however you want, center / leading etc but you MUST leave the alignment to be the center of the superview if you change it to top or leading it will convert the constraint so only constants work not multipliers

EDIT: To add constraints you use the red box to constrain the thing to expand and contract to the edges of the device, if you simply want to fix the size of the thing you can use the constraints in the yellow boxes, remember to click the add constraints button at the bottom