How To Create a Custom Search Bar Using UISearchController

Quite often it’s required from iOS applications to be capable of performing search in specific data that is displayed in a tableview. Undoubtably, most of developers have faced that situation, and the most usual approach to that is to use the default controls that the iOS SDK provides. Up to iOS 8, Apple was providing a special control for performing searches in tableviews named UISearchDisplayController. This controller, in conjunction with the UISearchBar was making possible to add search features quite easily in an application. Nevertheless, this belongs to history now.

Since iOS 8 coming, things changed a bit. First of all, the UISearchDisplayController has been deprecated, even though it’s provided as an available control in the Interface Builder’s controls collection in Xcode. A new controller named UISearchController has been given in its place. In spite of this change though, no visual control exists for it in the controls collection in Interface Builder; instead, it must be initialized and configured programmatically, but this is a really easy task, and you’ll see that later on.


Besides all the above, there’s another interesting point regarding the searching in a tableview datasource. iOS SDK provides a predefined appearance for the search bar, and that bar is suitable in many cases. However, when the UI of the app is highly customized, then it’s quite possible the default search bar format not to fit in the whole look and feel of the app. In that case the search bar must be customized appropriately so as to be a non-distinguishable part of the app ecosystem.

So, having said all the above, it’s time to present shortly what this tutorial is all about. I could say that through this text I’m aiming in two things: My first goal is to demonstrate how the new UISearchController presented in iOS 8 can be used so it’s possible to search and filter data using the default iOS search bar. You’ll see through the sample code we are about to write that configuring it it’s an easy process, regardless the fact that a visual control in the Interface Builder doesn’t exist.

[Read more…]

How To Implement Search Bar in iOS 7 Using Storyboard

Editor’s note: Like some of the programming tutorials, you may find the search bar tutorial no longer works in Xcode 5 and iOS 7. We’ve rewritten the tutorial to make it compatible with the latest version of Xcode. On top of that, we enhance the tutorial with custom table cell.

Enter the search bar tutorial.

In most of the iOS apps using table view, it is common to have a search bar at the very top of the screen. How can you implement a search bar for data searching? In this tutorial, we will see how to add a search bar to the recipe app. With the search bar, we’ll enhance the recipe app to let users search through the recipe list by specifying a search term.

Well, it’s not difficult to add a search bar but it takes a little bit of extra work. As usual, we’ll walk you through the concept and implementation by building a sample app. As our focus is on the search bar implementation, you can download this project template to start with. The template is similar to the app we built in the tab bar tutorial.

iOS 7 Search Bar
[Read more…]

How To Add Search Bar in Table View

Update: If you’re developing on Xcode 5 and iOS 7, check out the updated tutorial here.

One common questions I got about UITableView is how to implement a search bar for data searching. This tutorial will show how to add a search bar to the Tab Bar project. With the search bar, the app lets users search through the recipe list by specifying a search term.

Well, it’s not difficult to add a search bar but it takes a little bit of extra work. We’ll continue to work on the Xcode project we developed in the previous tutorial. If you haven’t gone through the tutorial, take some time to check it out or you can download the project here.