iOS 11 customise search bar in navigation bar
Interview Questions practice on Codemia
Over 8,000 real interview questions from top companies, searchable by company and role.
Introduction
iOS 11 made UISearchController feel like a first-class part of navigation by letting it live directly in the navigation bar. The right way to customize it is to install the search controller on navigationItem and then change the supported public UISearchBar properties rather than trying to fight the internal layout.
Attach the Search Controller to the Navigation Item
In iOS 11, the basic setup looks like this:
The important pieces are navigationItem.searchController and definesPresentationContext. Without the presentation context, search presentation can behave oddly during navigation transitions.
Customize the Public Search Bar Properties
Once the search controller is installed, use the search bar’s public styling properties:
These properties are stable and supported. They let you control placeholder text, cancel-button tint, and the general search bar appearance without depending on private internals.
If you want the search bar to stay visible instead of collapsing when the table scrolls, keep:
That one line changes the interaction model more than many visual tweaks do.
Customize Icons and Basic Visual Details
UISearchBar also lets you customize certain images using public API:
This is useful for mild branding or aligning the control with the rest of the app’s iconography. Stay within the public API surface where possible, because the search bar’s internal hierarchy changed across iOS versions and private subview access is brittle.
Know the Limits of iOS 11 Customization
This is where many developers get frustrated. In iOS 11, the search bar inside a navigation bar is not meant to be completely custom-designed. You can style the supported properties, but aggressive customization such as manually resizing internal fields, replacing subviews, or applying KVC hacks to private implementation details tends to break across versions.
If you need a radically custom search UI, the more reliable option is often to place your own search field in a custom header or a custom navigation title view instead of forcing UISearchController beyond its intended boundaries.
Search Behavior Matters as Much as Appearance
Search integration is not only a styling problem. Decide whether:
- the background should dim during search
- the search bar should hide on scroll
- results should update live while typing
- the current screen or a separate results controller should display matches
Those behavior choices change the user experience more than small color adjustments do. In many apps, the best customization is simply a clear placeholder, immediate filtering, and predictable navigation behavior.
Common Pitfalls
The most common mistake is trying to customize the search bar by reaching into undocumented subviews. That can work briefly and then break on the next iOS update.
Another pitfall is forgetting definesPresentationContext, which can cause the search UI to present from the wrong visual context during pushes or modal transitions.
It is also easy to over-customize the control visually while ignoring search behavior. A polished search bar still feels broken if it obscures content unexpectedly or hides itself when the design expects it to stay visible.
Finally, if you truly need a fully custom search experience, forcing UISearchController to behave like a bespoke view is often harder than building the custom UI directly.
Summary
- In iOS 11, place the search controller on
navigationItem.searchController. - Customize supported
UISearchBarproperties instead of private internal views. - Use
definesPresentationContextandhidesSearchBarWhenScrollingintentionally. - Public API supports useful visual tweaks such as placeholder text, style, tint, and icons.
- If the design requires deep visual changes, a custom search UI is often more reliable than fighting
UISearchController.
Related reading
- iOS 11 disable password autofill accessory view option?
- iOS 11 navigation bar height customizing
- iOS 11 navigationItem.titleView Width Not Set
- iOS 11 Safari bootstrap modal text area outside of cursor
- iOS 13 disable Dark Mode changes
- iOS 15 Navigation Bar Transparent
- iOS 15 UITabBarController's tabBar background color turns black
- iOS 5 Best Practice Release/retain?
.png&w=3840&q=75)
Tackling System Design Interview Problems
A short course that equips you with the skills to approach system design interviews methodically.
Start the free courseTrack what you have practised
A free account saves your progress, solutions and study plan across every problem on Codemia.
Interview Questions practice on Codemia
Over 8,000 real interview questions from top companies, searchable by company and role.