iOS auto layout not displaying button at fixed space from bottom

Question

I want to display a button(blue square in below images) at fixed distance from bottom of screen.

Below are contraints :

enter image description here

When running app on different simulators, button is displayed at different positions. Look below images to see the difference.

iOS 6.1 and 4 inch simulator :

enter image description here

iOS 7 and 4 inch simulator :

enter image description here

iOS 6.1 and 3.5 inch simulator :

enter image description here

On iOS 7 and 3.5 inch simulator, this button is not visible.i.e its origin.y is greater than screen height.

Any idea why this happens?

EDIT : Edited constraints (still not working)

enter image description here

UPDATE : I could narrow down the scope of issue. In storyboard, I have this button and other subviews in main view. Programmatically I add mapView to this main view and add all main view's subviews to mapView as shown below.

// Add mapView to main view
mapView = ...;
[self.view addSubview:self.mapView];

// Remove subviews from main view
[self.button removeFromSuperview];
...

// Add subviews into mapView so that they are visible on map
[self.mapView addSubview:self.button];
...

Now, If I comment above code and run the app then button is displayed at correct position, but with above code uncommented I run into the issue of button misplacement.

UPDATE : Partial answer to this issue is to add constraints programmatically. I said partial, because I have other views, along with this button, which are displayed properly. I don't have their constraints in code. Thus, there is still something to explore.

@footyapps27 Problem is in button's `origin.y` value and there is no view which is aligned to button to its left/right. All views are either above or below this button. — Geek, Jan 28 '14 at 16:30
Xcode 5 has a way of previewing what the layout of a storyboard/XIB will be in iOS 6. When you do that, what do you see? You may also have to upload a stripped-down project that indicates your problem. — Scott Berrevoets, Jan 28 '14 at 17:09
@Scott It is displayed fine when I do that. I could narrow down the issue. See my update. — Geek, Jan 29 '14 at 05:15

Alexander Ney · Accepted Answer · 2014-01-29T12:28:34.907

2

You are aligning the Button to the bottom layout guide which differs from aligning it to the bottom of the superview which I would suggest in this case. Aligning it to the vertical layout guide depends on iOS6/7 and if you allow the content of the view controller to go beneath the navigation bar / bottom bar.

Aligning it to the superview (container) could solve your issue. But the correct way to solve this would set the correct "extend edges" of the view controller. I am assuming that you enabled "under top bars" and "under bottom bars" on iOS7 that will explain the offsets. Disable them would for example mimic the same behaviour as iOS6 and you would not end up with those different offsets.

It really depends on what you have on your view controller (navbar, bottom bar etc.) and how you set the "edgesForExtendedLayout" of your view controller.

Edit: Calling [self.button removeFromSuperview];

will remove not just the button from the view but also all its constraints you set previously! So you have to set the constraints again - manually or avoid removing the button from its superview. I would guess thats why it looks fine in the Interface Builder and get messed up at runtime!

Documentation:

Calling this method removes any constraints that refer to the view you are removing, or that refer to any view in the subtree of the view you are removing.

edited Jan 29 '14 at 12:28

answered Jan 28 '14 at 12:50

Alexander Ney

781
3
10

I already use `self.edgesForExtendedLayout = UIRectEdgeNone;` and I tried setting constraint from superview's bottom instead of bottom guideline, but did not work. – Geek Jan 28 '14 at 13:02
do you have any ambiguous layout rules, or missing constraints that you are ware of? usually you can find some information about that in the log – Alexander Ney Jan 28 '14 at 13:05
Also, please compare photos of iOS 6.1 and devices of 2 different screen sizes. – Geek Jan 28 '14 at 13:09
There is no autolayout issue in log. – Geek Jan 28 '14 at 13:12
from the information you provided It is hard to figure out why this is not working. Maybe there is another constraint with a higher priority which is fulfilled. Would be interesting have more insight into your view hirarchy and other constraints. I retested the constraints of your button and they work perfectly on a blank view controller by setting the content extend to "none" – Alexander Ney Jan 28 '14 at 13:38
I have narrowed down the issue. Please check my update in question. – Geek Jan 29 '14 at 05:12
[self.button removeFromSuperview]; will remove not just the button from the view but also all its constraints set previously! So you have to set the constraints manually or avoid removing the button from its superview. https://developer.apple.com/library/IOs/documentation/UIKit/Reference/UIView_Class/UIView/UIView.html#//apple_ref/occ/instm/UIView/removeFromSuperview – Alexander Ney Jan 29 '14 at 09:39
Hi mate, if my updated answer helped you - it would be nice if you could accept my answer - have a nice day :) – Alexander Ney Feb 03 '14 at 10:00

score 1 · Answer 2 · edited May 23 '17 at 12:29

1

When you add your button programatically then you need to add
Autolayout constraints programatically as well

Apple Doc for Autolayout

Stackoverflow post

edited May 23 '17 at 12:29

Community

1
1

answered Jan 29 '14 at 10:04

bhavya kothari

7,484
4
27
53

I don't add button programatically. – Geek Jan 29 '14 at 12:09
@Geek This code is present in your question - what does it do ?? / Remove subviews from main view [self.button removeFromSuperview]; ... // Add subviews into mapView so that they are visible on map [self.mapView addSubview:self.button]; – bhavya kothari Jan 29 '14 at 13:11
Ok. You are talking about adding to mapView. Is there a way to copy the constraints instead of re-adding programmatically? – Geek Jan 30 '14 at 04:37
@Geek - No there is no workaround - ideal approach is to use one approach via code or visually else you will some problem which will difficult to fix – bhavya kothari Jan 30 '14 at 04:55
Ok. Here I have no option for mapView. As it is Google Maps I have to add through code. I tried saving button's constraints by calling `self.button.constraints`. But this property returns only width and height constraints and not other 2 constraints for x and y origin values. – Geek Jan 30 '14 at 05:00

score 0 · Answer 3 · answered Jan 28 '14 at 16:49

0

Since you are using X-Code 5.0.2, the xib's interface builder automatically comes as a Retina 4 inch full screen by default!!

Try changing that in Attributes Inspector to Retina 3.5 inch full screen.

Then change your constraints accordingly.

enter image description here

Try changing this & see how you need to change your constraints for 3.5 inch screen.

enter image description here

answered Jan 28 '14 at 16:49

footyapps27

3,982
2
25
42

I have set `view as iOS 6.1 and earlier` in IB. So whatever I am seeing is 3.5 inch screen. – Geek Jan 28 '14 at 16:55

iOS auto layout not displaying button at fixed space from bottom

3 Answers3