Abu Eesa Abu Eesa - 8 months ago 55
Swift Question

Sub View with 50% height of the space left between navigation bar & tabbar

I don't want to do this programatically. Please show me the storyboard way to achieve this.

enter image description here

I want orang view to of half size of the space between nav-bar & tabbar. Refere dashed rect, I want half of that rect.


There are a couple of ways to approach this that I can think of.

Use a container view

The first is to add a UIView to the superView to act as a container. You can "pin" this container view to the bottom of the navigation bar and the top of the tab bar.

Now add your orange view to this container. With constraints pinning it to the top, left and right. You can then give it equal height with the container and a 0.5 multiplier and it will have half the height between the nav bar and tab bar.

Use a "spacer" view

The other method is to use a spacer view. Add your orange view and then add another view beneath it. Pin them to the nav bar and tab bar respectively and give them a vertical spacing of 0 between them.

Now give them equal heights.

This will make them both take up half the space between the nav bar and the tab bar.

Now make the "spacer view" hidden. It will hide but the constraints will still work.

Both of these will work for any device size and any orientation. Also, for edge cases like if satnav guidance or an incoming call changes the height of the nav bar etc...