Friday, June 9, 2017

Equal height navigation bars

Leave a Comment

I have two pages in my app: One embedded in a UINavigationController and one thats not. The page that's not in the UINavigationController has a UINavigationBar that I dragged in and set its prompt to an empty string to increase its height a bit. However, this causes it to be slightly taller than the page that's embedded in a UINavigationController. Here's a side by side picture:

pic

If I set a prompt on the navigation bar of left page it's height becomes too tall. When I go to the storyboard inspector I see the height it should be is 74:

pic2

Does anybody know how to artificially make the bar on the page embedded in a UINavigationController the same height as the one that's not?

5 Answers

Answers 1

This situation is common for others who added the UINavigationBar manually (i.e. not via embedding inside UINavigationController).

Generic UINavigationBar would have height of 44 points

The issue is the 20 points gap above the manually added UINavigationBar.

In the case of embedded version, the gap (assuming it exists) has the same background color as the UINavigationBar. When you add the prompt, it added 30 points expanding upward. So instead of 20 + 44 = 64 points, now you have 74 points. And the embedded UINavigationBar has 64 points. Thus the difference of 10 points. And for the same reason, add " " (space) on embedded UINavigationBar will cause the height to be higher than 74 points.

I think your best bet would be to also embed the other ViewController inside a new UINavigationController. iOS is smart enough to treat it as if there is only one NavigationController, not two. The user would not experiencing any difference. As for the programmer, you need to take into account the extra UINavigationController if you need to find the second ViewController programmatically.

Answers 2

I was able to answer my own question.

I just programmatically changed the height within a custom UINavigationController subclass:

override func viewDidAppear(_ animated: Bool) {     let bounds = self.navigationBar.bounds     self.navigationBar.frame = CGRect(x: 0, y: 0, width: bounds.width, height: 74)  } 

Answers 3

Although you've already answered your question, AFAIU the height difference is the result of having prompt in one case but not the other. So what is wrong with adding an empty string prompt for the ViewController inside UINavigationController using UINavigationItem such as:

self.navigationItem.prompt = ""; 

If you have many view controllers inside your UINavigationController and don't want to set prompt explicitly in each, you can use UINavigationControllerDelegate willShow or didShow event to set it in a single place for all child controllers.

This should be much more reliable than your approach because navigation bar height is not actually the same on all devices and all device orientations (AFAIR iPad portrait and landscape are different), moreover Apple can change it between iOS versions.

Answers 4

Try to put constraints in the UINavigationBar for height equals 64. storyboard capture

Answers 5

Navigartionbar have same constant size of 44. Either you embed it or use custom navigation. please check below image.

here I have embedded navigation in first and second is having custom one. There is no height issue.

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment