SwiftUI Tutorial — Lists and Navigation

Using List and NavigationLink with SwiftUI

Note: This tutorial is also available in video form on YouTube

With SwiftUI, Apple introduced List to be able to display a collection of content. Previously, with UIKit, one had to use a UITableView and implement delegate and data source methods (e.g. didSelectRowAt) to provide row content and navigate between views when a row is selected.

Since SwiftUI is declarative, the content of each row is provided at the time of declaring the List. In addition, we can now use a NavigationLink to handle navigation between views.

We will be building a simple app that displays a list of emoji, tapping on any of the emoji will let you navigate to a different view showing details about the emoji, like so:

List