2

I want to create a UIViewController that should be separated in two equal (in both width and height) parts.

The top one should contain UIView. The bottom one should contain the button centered both horizontally and vertically in this part:

enter image description here

I placed the UIView object to the right place by setting its leading, trailing and vertical space to superview to 0. I made it 0.5x screen's size by setting the equal heights for this UIView and its superview and gave it 2:1 multiplier where the first value related to the superview and the second value to the specified UIView.

But how can I place the button at the center of the bottom half of the screen?

I'm using auto-layouts and size classes.

Bhavin Bhadani
  • 22,224
  • 10
  • 78
  • 108
FrozenHeart
  • 19,844
  • 33
  • 126
  • 242
  • What I would do is create a button, and set the x (or you could try the button frame's center) to 1/2 the size of the screen, the y to screen.height * 0.3, and make the width/height 100 (for a small button)... – user2277872 Feb 23 '16 at 07:52

6 Answers6

2

I'll suggest you to take 2 UIViews instead 1, i.e top view and bottom view.

  • pin all edges of both UIViewsto 0, make equal height.
  • than in second UIView i.e bottom view set button to center of that view and give center X and center Y constraints along with height and width to button.
Bhavin Bhadani
  • 22,224
  • 10
  • 78
  • 108
  • What do you mean by pinning all edges? Should I set leading, trailing and top / bottom space to 0? – FrozenHeart Feb 23 '16 at 08:23
  • Ok, I set the top view's leading, trailing and top space to 0 and the bottom view's leading, trailing and bottom space to 0. I also set vertical space between these views to 0. Is it ok? Because I got this error -- "Need constraints for: Y position" – FrozenHeart Feb 23 '16 at 08:28
  • 1
    ya its ok now just select both views and give `equal height` constraint...so that warning resolves – Bhavin Bhadani Feb 23 '16 at 08:29
  • Yep, that's great. Why if I set leading and trailing space to 0 it has unused space between view and its view controller's view anyway? – FrozenHeart Feb 23 '16 at 08:33
  • 1
    maybe its constarints to margin...uncheck constraints to margin when you pinned your edges.. – Bhavin Bhadani Feb 23 '16 at 08:34
  • you can check more complecated UI for button center here.... http://stackoverflow.com/questions/31517024/xcode-6-constraints-with-button-images/31518450#31518450 ... check out may be helps you out some time – Bhavin Bhadani Feb 23 '16 at 08:35
  • check this for unused space ... http://stackoverflow.com/questions/25807545/what-is-constrain-to-margin-in-storyboard-in-xcode-6 – Bhavin Bhadani Feb 23 '16 at 08:36
2
button.centerX = view.centerX
button.centerY = view.centerY*1.5

will give you what you want. You should add the width and height constraints of button as you demanded.

meth
  • 1,887
  • 2
  • 18
  • 33
1

assuming your button superview is directly your viewController:

- (void) viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];
    myButton = CGPointMake(myButton.superview.center.x, myButton.superview.frame.size.height * 3 / 4);
}
meronix
  • 6,175
  • 1
  • 23
  • 36
0

You can use Alignment constraints like Horizontally in container and Vertically in container. Hope this helps.

Sanket_B
  • 735
  • 9
  • 26
  • And what should I set for them? I don't want to set constant values because it should be placed in the center despite of the device's screen size – FrozenHeart Feb 23 '16 at 07:52
  • just set constant width and height for ur button and horizontally and vertically in container OR if u dont want fixed size of button set leading, trailing, top, bottom , horizontally & verically center to it's superview i.e. bottom view – Sanket_B Feb 23 '16 at 07:56
  • I think that you mean that I should add another `UIView` to the bottom half of the screen, right? – FrozenHeart Feb 23 '16 at 08:00
0

These are the steps you need to do. 1. Go to the size inspector with your UIView selected. For X and Y should equal 0. For example, Width should be 600 and height should be 300. So the whole screen is 600 by 600. 2. Select the button with the size inspector still selected. Observe the width and height values. Realize that X and Y is measured from the top left corner of the button. Now take your width of the whole screen and subtract half the width of your button, also take the height of half your screen and subtract half the height of your button. Enter these values into the position of your buttons x and y values.

i.e. if button is 50X100 (width by height) you need be at x= 300-50/2= and y= 450 -100/2=400

Kyle Griffith
  • 114
  • 10
0

Swift 5 with SnapKit

        customView.snp.makeConstraints { (m) in
            m.centerX.equalToSuperview()
            m.centerY.equalToSuperview().multipliedBy(1.5)
        }
DNG
  • 599
  • 4
  • 14