How to remove 1px bottom border from UINavigationBar *with* a UISearchController?

Question

I have a navigation bar which includes a UISearchController , and I cannot find a way to get rid of the 1px bottom border below the navigation bar:

I am already using the tricks for removing the navigation bar bottom border as suggested in this answer and many others:

navigationBar.isTranslucent = false
navigationBar.setBackgroundImage(aTransparentImage, for: .default)
navigationBar.shadowImage = nil

If I don't set the searchController on the navigationItem of my view controller it's fine, there is no bottom border, but as soon as I set the searchController it appears.

Even the dirty hacks that look for a 1px UIImageView in the nav bar view hierarchy don't work, as it seems this view is in a separate tree of the hierarchy. It's the UIImageView highlighted in blue below:

I'm out of ideas 😕

Answer 1

Ok, a colleague of mine provided a solution. In viewWillAppear in the view controller which is showing the search bar do:

if let imageView = navigationItem.searchController?
    .searchBar.superview?
    .subviews.first?
    .subviews.last as? UIImageView,
    imageView.frame.height * UIScreen.main.scale == 1.0 {
    imageView.isHidden = true
}

This is obviously highly dependent on the exact view hierarchy that UIKit is using for the search bar, and could stop working with any future release of iOS (it works on iOS 12). You could make it more resilient by searching the superview subviews for a 1px height UIImageView , but still, it's quite a hack.

But so far, it's the only solution I have found that works.

Answer 2

Try to add

self.extendedLayoutIncludesOpaqueBars = true

or

self.automaticallyAdjustsScrollViewInsets = false;
self.extendedLayoutIncludesOpaqueBars = true

in ViewDidLoad Method. It worked for me