How to get rid of small gap between UINavigationController and UISearchBar?

Question

How do I get rid of this small gap between the navigation bar and the search bar?

Here is the code for customizing the appearance of the navigationbar and the search bar:

 self.navigationController?.navigationBar.barStyle = .Black
    self.navigationController?.navigationBar.barTintColor = UIColor(red: 41/255, green: 128/255, blue: 185/255, alpha: 1.0)
    self.navigationController?.navigationBar.tintColor = UIColor.whiteColor()
    let navigationTitleFont = UIFont(name: "Avenir", size: 20)!
    self.navigationController?.navigationBar.titleTextAttributes = [NSFontAttributeName: navigationTitleFont]

    self.navigationController?.navigationBar.translucent = true

    self.searchController = ({
        let controller = UISearchController(searchResultsController: nil)
        controller.searchResultsUpdater = self
        controller.hidesNavigationBarDuringPresentation = true
        controller.dimsBackgroundDuringPresentation = false
        controller.searchBar.sizeToFit()
        self.tableView.tableHeaderView = controller.searchBar
        self.definesPresentationContext = true
        controller.searchBar.returnKeyType = .Search
        controller.searchBar.delegate = self

        return controller

    })()

    searchController.searchBar.placeholder = "Search Employees"
    for subView in searchController.searchBar.subviews {
        for subsubView in subView.subviews {
            if let textField = subsubView as? UITextField {
                textField.attributedPlaceholder = NSAttributedString(string: "Search Employees", attributes: [NSFontAttributeName: UIFont(name: "Avenir", size: 14)!])
                textField.font = UIFont(name: "Avenir", size: 14)
            }
        }
    }

    searchController.searchBar.setBackgroundImage(UIImage(named: "blue"), forBarPosition: .Any, barMetrics: .Default)
    searchController.searchBar.backgroundColor = UIColor.clearColor()
    searchController.searchBar.barTintColor = UIColor(red: 41/255, green: 128/255, blue: 185/255, alpha: 1.0)
    searchController.searchBar.tintColor = UIColor.whiteColor()
    searchController.searchBar.clipsToBounds = true

could the small gap be the border of the UINavigationBar? If so, maybe [this answer](http://stackoverflow.com/a/19227158/2557145) can help you. — Palle, Aug 15 '15 at 02:10
No, it doesn't seem to be the border. I added this line of code: self.navigationController?.navigationBar.layer.borderWidth = 0. This did nothing. — Rehaan Advani, Aug 15 '15 at 02:12
The border on the UINavigationBar is not made with a CALayer but with an UIImageView. The answer, I put a link to in the first comment, shows a way to get rid of it. — Palle, Aug 15 '15 at 02:17
@blobbfuesch I looked at the answer you provided, and it didn't seem to work. I set the background image and shadow image of the navigation bar, but it didn't work. — Rehaan Advani, Aug 15 '15 at 02:31
Why are you using `controller.searchBar.sizeToFit()` and `searchController.searchBar.clipsToBounds = true`? I believe you are overdoing the styles, and the effect desired can be achieved with fewer lines of code. Comment out all the appearance code and uncomment lines one by one to see what causes the problem. — duci9y, Aug 15 '15 at 05:53

score 1 · Answer 1 · answered Aug 15 '15 at 03:13

1

You can solve this by setting the top content inset of your table view to -1:

self.tableView.contentInset = UIEdgeInsetsMake(-1, 0, 0, 0)

answered Aug 15 '15 at 03:13

Palle

11,511
2
40
61

Thank your for the response! I implemented this, but it did not work. Any other ideas? – Rehaan Advani Aug 15 '15 at 05:49

Larry Pickles · Accepted Answer · 2015-08-15T06:07:11.150

1

Try this out, I don't do swift, so this could be syntactically, incorrect, but it does compile in swift code, this is translated from ObjC where I do this sort of thing all the time:

    self.navigationController?.navigationBar.setBackgroundImage(UIImage .new(), forBarMetrics: .Default)
    self.navigationController?.navigationBar.shadowImage = UIImage .new()
    self.navigationController?.navigationBar.layer.shadowRadius = 0
    self.navigationController?.navigationBar.layer.shadowOpacity = 0
    self.navigationController?.navigationBar.layer.shadowOffset = CGSizeMake(0, 0)

    self.navigationController?.navigationBar.translucent = true
    self.navigationController?.navigationBar.backgroundColor = UIColor .clearColor()
    self.navigationController?.navigationBar.tintColor = UIColor .clearColor()

Something like this may help as well:

var sds: UISearchBar

        sds.layer.borderColor = UIColor .clearColor().CGColor
        sds.layer.borderWidth = 1

edited Aug 15 '15 at 06:07

answered Aug 15 '15 at 05:39

Larry Pickles

4,615
2
19
36

Thank you for the response! I tried this, but it simply made my navigation bar have a background color of white. Any other ideas? – Rehaan Advani Aug 15 '15 at 05:51
set the background color to clear color, this might work and then set it to translucent as well – Larry Pickles Aug 15 '15 at 05:56
Also, since this is going to remove the entire nav bar, basically, except for the navigation items, you may need to set the background color of the navigation controller's view to the color of the blue you want to use – Larry Pickles Aug 15 '15 at 05:59
This just made my navigation bar and my status bar completely transparent – Rehaan Advani Aug 15 '15 at 06:00
but, does it still have the navigation items? – Larry Pickles Aug 15 '15 at 06:00
Yeah, it still has the navigation items – Rehaan Advani Aug 15 '15 at 06:03
Also, let me add something else, this may help too, I just rmeembered that UISearchBar has a border, yep, check my answer now, see if messing aroudn with the search bar border through it's layer will help – Larry Pickles Aug 15 '15 at 06:03
perfect, that's good, now try to recolor the border of the search bar – Larry Pickles Aug 15 '15 at 06:08
My search bar disappeared after all of that code. This happened even after I recolored the border. – Rehaan Advani Aug 15 '15 at 06:10
Ahh yeah, it's probably disappeared below the navigaiton bar now, you'll have to offset the UIsearch bar the height of the navigation bar, it's annoying, but that's the product of doing all the lines and borer removal, so let's say you have your search bar with CGRect(0,0,screeen width, 55), you have to do this CGRect(0, heightforNavbar, screen width, 55), the height is like 64 and this includes the status bar, this is just a HUNCH, I could be wrong on this one, – Larry Pickles Aug 15 '15 at 06:12
No actually, your method worked for me just now. I realized I had accidentally deleted a line of code that would make the search bar disappear. Thank you! – Rehaan Advani Aug 15 '15 at 06:13
WOOT WOOT, that's great! – Larry Pickles Aug 15 '15 at 06:16

How to get rid of small gap between UINavigationController and UISearchBar?

2 Answers2