Chapters
Chapters

Chapters

Hide chapters

UIKit Apprentice

Third Edition · iOS 18 · Swift 5.10 · Xcode 16

Before You Begin

Section 0: 5 chapters
Show chapters Hide chapters

Getting Started

Section 1: 8 chapters
Show chapters Hide chapters

Checklists

Section 2: 12 chapters
Show chapters Hide chapters

My Locations

Section 3: 11 chapters
Show chapters Hide chapters

Store Search

Section 4: 13 chapters
Show chapters Hide chapters

32. Search Bar
Written by Fahim Farook

Heads up... You’re accessing parts of this content for free, with some sections shown as scrambled text.

Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now

Heads up... You’re accessing parts of this content for free, with some sections shown as scrambled text.

Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now

One of the most common tasks for mobile apps is to talk to a server on the Internet — if you’re writing mobile apps, you need to know how to upload and download data.

With this new app named StoreSearch, you’ll learn how to send HTTP GET requests to a web service, how to parse JSON data, and how to download files from a server.

You’re going to build an app that lets you search the iTunes store. Of course, your iPhone already has apps for that — “App Store” and “Music” to name two, but what’s the harm in writing another one?

Apple has made a web service available for searching the entire iTunes store and you’ll be using that to learn about networking.

The finished app will look like this:

The finished StoreSearch app
The finished StoreSearch app

You will add search capability to your old friend, the table view. There is an animated pop-up with extra information when you tap an item in the table. And when you flip the iPhone over to landscape, the layout of the app completely changes to show the search results in a different way.

With the last app, you dipped your toe in the dark mode pool. Now you’ll dive in head first and learn all about how to support different appearance modes by building this app from the ground up to support both light and dark modes.

There will also be an iPad version of the app with a custom UI for the iPad:

The app on the iPad
The app on the iPad

StoreSearch fills in the missing pieces and rounds off the knowledge you have gained from developing the previous apps. You will also learn how to distribute your app to beta testers, and how to submit it to the App Store.

In this chapter, you will do the following:

  • Create the project: Create a new project for your new app. Set up version control using Git.
  • Create the UI: Create the user interface for StoreSearch.
  • Do fake searches: Understand how the search bar works by getting the search term and populating the table view with fake search results.
  • Create the data model: Create a data model to hold the data for search results and allow for future expansion.
  • No data found: Handle “no data” situations when doing a search.

There’s a lot of work ahead, so let’s get started!

Create the project

Fire up Xcode and make a new project. Choose the App template and fill in the options as follows:

  • Product Name: StoreSearch
  • Team: Default value
  • Organization Identifier: com.yourname
  • Interface: Storyboard
  • Language: Swift
  • Testing System, Storage: set these to None

When you save the project Xcode gives you the option to create a Git repository. You’ve ignored this option thus far, but now you should make sure it is enabled:

Creating a Git repository for the project
Creating a Git repository for the project

If you don’t see this option, click the Options button at the bottom-left of the dialog.

Git and version control

Git is a version control system — it allows you to make snapshots of your work so you can always go back later and see a history of the changes made to the project. Even better, a tool such as Git allows you to collaborate on the same codebase with multiple people.

The first screen

The first screen in StoreSearch will have a table view with a search bar — let’s create the view controller for that screen.

Test dark mode

Since we are building the app for both appearance modes from the ground up, we should test each screen for both appearance modes each time we do any testing.

Lca Btoxe udcumabpoqn uvecfinor
Sco Hzifu apwanofyokc apubsahic

Git version control

Notice that the project navigator now shows M and A icons next to some of the filenames in the list:

Bsuna mdipg dju bosiy bpif ahe majoxiih
Cjomi jqich zza xugoq bzuq ijo korojuux

Kru hajyezh ut wucjats his hdeg slahebz
Gno bisvaqd op duzkixd yuf gder yjukuml

Yyiqe wdidd fse rtetloj tei’qi noje sifke zyu dukw hombon
Yrobo gjobv gha vzufcil xei’yu nugi besho vle kudh laynal

Miej luwniw ip ximviq ag qvo xbicakf sihnisr
Hain woldur om hufmop uq mju bxulavz milwexs

Create the UI

StoreSearch still doesn’t do much yet. In this section, you’ll build the UI to look like this — a search bar on top of a table view:

Tdi ubb dozk u ciepkd lin ung qolco jaup
Qza ety rann e xeunyq nug ocv ruqxo weur

UITableViewController vs. UIViewController

So what exactly is the difference between a table view controller and a regular view controller?

Set up the storyboard

➤ Open the storyboard and use the Interface Builder toolbar to switch to the iPhone SE (3rd generation). It doesn’t really matter which iPhone model you choose here, but the iPhone SE makes it easiest to follow along with this book.

Tcouyidc tucpwyoempl ge meg pjo Xovme Pial
Fbioyovd yaxbvhoakss gu cih zha Mufsu Pial

Nuothv Pip dagx fa junef aj Sahfi Huaw (vawf), geg oklewe (mikzg)
Raivnj Nev xupq ne nogav ef Wamqu Waut (bepy), kax epmoko (taytf)

Vyu xozpwviosqy niv pre Toihpv Quk
Bqe juyrrbaayrt fuw cpe Peaxkn Tin

Wpa quokpd huor batmxuclij xiyc Zuihtr Keq eky Layso Zaoq
Qro coepqb roep lekgguphuq voxb Qoijkk Xop aqv Tajzu Kaej

Connect to outlets

You know what’s coming next — connecting the Search Bar and the Table View to outlets on the view controller.

Do fake searches

Before you implement the iTunes store searching, it’s good to understand how the UISearchBar component works.

Add a search bar delegate

➤ Add the following to the bottom of SearchViewController.swift, after the final closing bracket:

Show fake results

➤ Add the following new (and empty) extension to SearchViewController.swift:

Kfi pizfobreirr wqal Hoinsn Meav Rumcdirbod ra zki atkaf uqraxmq
Hdo goxkudpeayh qkah Roiqkr Hoer Wayvkaxluq zi jgu idzog eczogzp

Tza imq sgedc goha hajiszr pvak qio diiryc
Zwe azt gyizm loke nufoqxz kkur xuo heuxnj

UI Improvements

There are some issues with the current implementation of the app though – some are immediately evident, while others are a bit more subtle.

Table view content insets

The first thing you might have noticed: the first row of the Table View is hidden beneath the Search Bar.

Dismiss keyboard on search

It’s not very nice that the keyboard stays on screen after you press the Search button. It obscures about half of the table view and there is no way to dismiss the keyboard.

Extend search bar to status area

The search bar has a slightly jarring line above it to separate it from the status area. Also (a lot more subtle), if you scroll the table view, you’ll see the row text through a tiny gap between the search bar and the status bar – this is more evident in dark mode than light mode.

Hco giegdt yex ir “oqsudriw” mo pre miq aq wya wtliel
Tfa touklc xiv ob “avnobrow” qu yno xom et vne klniab

The API documentation

If you were to look in the API documentation for UISearchBarDelegate you wouldn’t find the position(for:) method that you used above.

Create the data model

So far you’ve added String objects to the searchResults array, but that’s a bit limited. The search results that you’ll get back from the iTunes store include the product name, the name of the artist, a link to an image, the purchase price, and much more.

The SearchResult class

➤ Add a new empty file to the project and name the new class SearchResult.

Moyi labuyps ix i tarmoyho xepf
Xuwo jutibxz ay a fokxowmo solz

No results found

When you add search functionality to your apps, you have to handle the following situations:

Handle not getting any results

In defense of good taste, the app will return 0 results when a user searches for “justin bieber”, just so you know the app can handle this kind of situation.

Oge lal boni…
Ozu maj maga…

Handle no results when app starts

Unfortunately, the text “Nothing found” also appears initially when the user has not searched for anything yet. That’s just silly.

Selection handling

One more thing, if you currently tap on a row it will become selected and stay selected.

31. Polishing the App
33. Custom Table Cells
Have a technical question? Want to report a bug? You can ask questions and report bugs to the book authors in our official book forum here.
© 2026 Kodeco Inc.

You’re accessing parts of this content for free, with some sections shown as scrambled text. Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.

Unlock now