iPhone 8: view doesn't hide under the Navigation bar

Question

I have searched all the questions and mostly developers are asking how to solve issue where view is hiding behind navigation bar, on the other hand I want to hide my view behind the navigation bar but had no luck.

I have a tableview and I want that to start from behind navigation bar.

I have tried following so far.

    self.navigationController?.navigationBar.isTranslucent = true
    self.extendedLayoutIncludesOpaqueBars = true
    self.edgesForExtendedLayout = .top

But no luck, I also tried enabling via storyboard but that also didn't do a thing.

Adding screenshot

This is NavBar's inspecter,

This is what it's showing,

We can cell starts right after the bar.

Cell Hierarchy,

You might want to post a screen shot of your storyboard with this. — Adrian, Apr 05 '18 at 18:21
Have you tried it with constraints? You could add Vertical Spacing To Top Layout Guide constraint from your TableView to the View of your ViewController, and put a negative value on it. — GabrielaBezerra, Apr 05 '18 at 18:23
I totally can do that but I don't want to set negative offset when Apple has provided a property on UIViewControllers that should do this job. I first want to see if this is fixable or what am I missing probably. — Arun Kumar, Apr 05 '18 at 18:29
What is inside the view? A tableview automatically adjusts its insets to display its content below the nav bar, maybe that's what's going on? — Julien Perrenoud, Apr 05 '18 at 18:31
@JulienPerrenoud I tried with UIVIew as well but same behavior. For now tableView has all empty cells randomly just showing numbers to test this. — Arun Kumar, Apr 05 '18 at 18:34
This doesn't seem to be a table view controller. It looks like it's just a "loose" table view. So it would be up to you to pin the top of the table view to the top of the main view rather than to the top of the safe area or top layout guide. Have you done that? You have not said _anything_ about how this table view is positioned, but clearly since we don't have a fullscreen table view controller, that's crucial. Of course, if you would just use a table view controller the problem would be solved even more simply. — matt, Apr 05 '18 at 18:35
@matt I have tried top to topLayoutGuide as well that also didn't help and It's not about tableView I guess because I have tried just a view controller with just view in it and still can't have the behavior I want. — Arun Kumar, Apr 05 '18 at 18:39
@ArunKumar Could you show the view hierarchy for your screenshot with the green and yellow cells? Is the tableview frame top at the same level as the top of the green cell, or is there blank space between the tableview top and the start of the green cell? — Julien Perrenoud, Apr 05 '18 at 18:43
@JulienPerrenoud I have added a screenshot for that and yes cell is starting right after navbar there is not cell behind it — Arun Kumar, Apr 05 '18 at 18:47
@matt I read your answer again let me try what you suggested if it works I will choose it. Thanks — Arun Kumar, Apr 05 '18 at 19:09
@ArunKumar Seeing your screenshot, it looks like your tableView is constrained to the top like you want it to. Now you just need to remove the tableView `contentInset` with `tableView.contentInset = .zero`. You can also do this in xib/storyboard by un-ticking "Adjusts Scroll View Insets" in the ViewController "Layout" section — Julien Perrenoud, Apr 05 '18 at 19:11
@JulienPerrenoud I did try that too but it doesn't take the content behind bar — Arun Kumar, Apr 05 '18 at 19:18

score 0 · Answer 1 · edited Apr 05 '18 at 19:22

0

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)

    // Hide the Navigation Bar
    self.navigationController?.setNavigationBarHidden(true, animated: animated)
}

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)

    // Show the Navigation Bar
    self.navigationController?.setNavigationBarHidden(false, animated: animated)
}

edited Apr 05 '18 at 19:22

Rashed

2,349
11
26

answered Apr 05 '18 at 18:54

Wang90925

142
6

This will hide my navigation bar when view will appear on screen. I want NavigationBar to be there but content be underneath. – Arun Kumar Apr 05 '18 at 18:57

score 0 · Accepted Answer · answered Apr 05 '18 at 19:03

The key thing is how you pin the top of your view. It must be pinned to the top of the main view — not the top main view margin, not the safe area / top layout guide. Look carefully at this screen shot: this is how your top constraints must look:

When the app runs, the view underlaps the navigation bar, just as shown in Interface Builder:

iPhone 8: view doesn't hide under the Navigation bar

2 Answers2