UISearchBar's height is incorrect when presenting search result controller

Question

I have a search bar in tableView's header view, and I don't change the height of it(default is 56pt). When search bar is active and its position goes top of the screen, it's height becomes 50pt. It will both happen on iPhone or simulator, version iOS 11.

First appear:

<UISearchBar: 0x7f94b6646900; frame = (0 0; 375 56); text = ''; gestureRecognizers = <NSArray: 0x60400025fc20>; layer = <CALayer: 0x604000225fe0>>

Editing:

<UISearchBar: 0x7f94b6646900; frame = (0 14; 375 50); text = ''; autoresize = W+TM; gestureRecognizers = <NSArray: 0x60400025fc20>; layer = <CALayer: 0x604000225fe0>>

It results in a weird gap between the search bar and result controller's view.

Thanks for any ideas.

Edit1: Here's my code:

fileprivate func configSearchBar() -> Void {
    let bar = self.searchBar
    var size = bar.frame.size

    let statusBarHeight = UIApplication.shared.statusBarFrame.size.height
    bar.setBackgroundImage(UIImage.imageWith(color: .white, size: size),
                           for: .any,
                           barMetrics: .default)
    let colorWhenEditing = UIColor.colorFromHexString("#FAFAFA")
    if UIDevice.isIPHONEX() {
        bar.barTintColor = colorWhenEditing
    } else {
        bar.setBackgroundImage(UIImage.imageWith(color: colorWhenEditing, size: CGSize(width: size.width, height: size.height + statusBarHeight)),
                               for: .topAttached,
                               barMetrics: .default)
    }
    size = CGSize(width: bar.frame.size.width - 30, height: 30)
    let image = UIImage.imageWith(color: UIColor(hexString: "#F0F0F0"), size: size)?.zoom(toSize: size, cornerRadius: 4)
    bar.setSearchFieldBackgroundImage(image, for: .normal)

    bar.searchTextPositionAdjustment = UIOffset(horizontal: 5, vertical: 0)
}

self.tableView.tableHeaderView = self.searchBar

Edit2: - Search controller and search bar initialization:

// Main view controller
lazy var searchResultController: UISearchController = {
    let vc = MailSearchResultViewController(nibName: nil, bundle: nil)
    let sc = UISearchController(searchResultsController: vc)
    sc.searchResultsUpdater = self
    sc.modalPresentationCapturesStatusBarAppearance = true
    sc.delegate = self
    return sc
}()
var searchBar: UISearchBar {
    return searchResultController.searchBar
}
// MailSearchResultViewController - viewDidLoad:
self.edgesForExtendedLayout = []
self.automaticallyAdjustsScrollViewInsets = false

How did you add it as a header view to the table view? have you done it in the code? — Ahmad F, Dec 27 '17 at 07:50
Would you try [this answer](https://stackoverflow.com/questions/47987619/how-to-open-uisearchbar-like-iphone-settings-search-bar/47988164#47988164) instead of doing it programmatically? — Ahmad F, Dec 27 '17 at 08:15
@KleinMioke where you're configuring the `self.searchBar` code or storyboard? Share the same. — Imad Ali, Dec 27 '17 at 08:59
@KleinMioke your `navigationBar` is Translucent or Opaque..? — Gokul G, Dec 29 '17 at 08:12
Have a look at my answer here: https://stackoverflow.com/a/43278771/5329717 Perhaps it will solve your problem. — Kamil.S, Dec 29 '17 at 12:57
Hey just a guess ,try unchecking the adjust Scroll view inset from the storyboard by selecting the view controller in layout options. https://stackoverflow.com/questions/27554898/uiscrollview-not-scrolling-after-unchecking-adjust-scroll-view-insets-xcode-6 — Pallavi Srikhakollu, Jan 03 '18 at 06:41
@PallaviSrikhakollu I don't use storyboard, but I set that property programmatically to false. That's not work. — Klein Mioke, Jan 03 '18 at 10:31

score 0 · Answer 1 · answered Jan 04 '18 at 12:58

0

I think issue is with automatically adjust scrollView Insets. To resolve this problem do the Following

Go to storyboard.
Select controller containing searchbarcontroller
Go to attribute inspector
Uncheck Adjust Scroll View Insets

answered Jan 04 '18 at 12:58

Abu Ul Hassan

1,340
11
28

I don't use storyboard, I programmatically set `automaticallyAdjustsScrollViewInsets` to false in search result view controller and UISearchController, but that doesn't work. – Klein Mioke Jan 05 '18 at 06:01

score 0 · Answer 2 · answered Jan 05 '18 at 17:45

Since you are working on iOS 11 and from the comments it seems you have a navigation controller, you should consider putting the search bar directly inside your navigation item instead of the table view header which will still be the method you should use on iOS 10 and before. You can check out the documentation here.

It seems that since Apple introduced this new way of displaying the search bar UIKit is no longer correctly able to display it from the table view header on iOS 11 and later. You can also check this question (in ObjC) where this same change introduces your same problem or this video from Apple.

UISearchBar's height is incorrect when presenting search result controller

2 Answers2