Bottom Margin in iPhone X using storyboard

Viewed 5299

Ok I have this case,

There is this screen I designed for iphone 8

enter image description here

As you can see here there is 8px green view that I pinned to the bottom of the superview by making a constrain of 0px between this view and top of bottom layout guide. and it works fine on all phone EXCEPT for the new iPhone X where this happens:

enter image description here

and thats not my intended behaviour. I want to to be as the other iPhones, pinned to the bottom with 0 margin.

Is there is a solution for that using the storyboard? Please post solutions using storyboard only. I know that I can do it programmatically. this should be easy on storyboard I guess.

Thank you

3 Answers

1- Select your view in storyboard



2- Double click on bottom space constraint and select Superview for first item enter image description here

3- Set constant value to 0

You can achieve this

enter image description here

By Setting AutoResizing like this in storyboard

enter image description here

With AutoLayouts

enter image description here

In storyboard select "View as: iPhone X" and pin the desired view to superview, not Bottom Layout Guide or Safe Area (in my example it's a full screen image view, your view would be pinned only to bottom):

enter image description here

Alternatively, if you are not in iPhone X view, you can pin bottom edge to superview by dragging with ctrl key and then when selecting from the list, press option key - more details in this answer: Autolayout: Add constraint to superview and not Top Layout Guide?

Related