How to center two labels

问题:

I have two buttons. I want both buttons on the same line horizontally and i want equal space on the left of the left button, between the two buttons, and on the right of the right button.

I want to center two buttons like this:

回答1:

If I were you, I would make them programmatically. This would work if they were contained in a view. The code below assumes you want to center the buttons in your viewController.

To Make UIButtons Programmatically

In ViewDidLoad:

        let myFirstXCoordinate = CGFloat((self.view.width / 4) - (myWidth / 2))
        let mySecondXCoordinate = CGFloat((3 * self.view.width) / 4) - (myWidth / 2))
        let myWidth:CGFloat = //your button's width
        let myHeight:CGFloat = //your button's height
        let myYCoordinate:CGFloat = //your Y Coordinate

        firstButton.setBackgroundImage(UIImage(named: "myRedOvalThingyImage"), forState: .Normal)
        firstButton.backgroundColor = UIColor.clearColor()
        firstButton.frame = CGRectMake(myFirstXCoordinate, myYCoordinate, myWidth, myHeight)
        firstButton.addTarget(self, action: #selector(ViewController.pressedFirst(_:)), forControlEvents: .TouchUpInside)
        buttonView.addSubview(firstButton)

        secondButton.setBackgroundImage(UIImage(named: "myRedOvalThingyImage"), forState: .Normal)
        secondButton.backgroundColor = UIColor.clearColor()
        secondButton.frame = CGRectMake(mySecondXCoordinate, myYCoordinate, myWidth, myHeight)
        secondButton.addTarget(self, action: #selector(ViewController.pressedSecond(_:)), forControlEvents: .TouchUpInside)
        buttonView.addSubview(secondButton)

Outside ViewDidLoad:

func pressedFirst(sender: UIButton!) {
print("First Oval Thingy Was Pressed")
}

func pressedSecond(sender: UIButton!) {
print("Second Oval Thingy Was Pressed")
}

回答2:

When you work with constraints, you must work block.

In this case you should have 2 blocks, both the same size as going from 0 to center and center the width of the parent.

Example:

Parent Width: 320

let widthBlock = 320/2

block 1: x = 0, width = widthBlock
block 2: x = widthBlock, width = widthBlock

Then within each block you create your buttons and You center both vertically and horizontally using constraints.

As you're doing with the interface it is far simpler, just drag from the button to block and give his father Center Horizontal in Container and Center vertically in container.

回答3:

You can do it with autolayout by add three space view (UIvews) to left, center, right.

• Add constraints to set all space views equal width, and fix height (ex: 30).
• Add constraints fit space betwen spaceview and button to 0, and spaceview with supper view to 0.
• Add constraints to centerY for all space views and button.
• Add Constraints to top superview.

when completed the view look like

回答4:

One of the easiest ways of this problem is to use spacer views.

Two red buttons will have fixed widths and three light gray spacer views will also have equal widths. Now pin all of the 5 components with neighbour component.

Here I have taken a container view. You can ignore it if you do not need it.

Here is the output in different screens:

Note: 5.5 screen is not included here because of the space limitation, but you can check in 5.5 screen too, it will work.