The previous chapter showed you how to build a list of items using a table view. In this chapter, you'll learn how to display the same items using a more flexible component. This component is called UICollectionView, and it has a very similar interface to UITableView. The most significant difference is that you can define a much more flexible layout using a collection view. An example of this is the grid layout that UICollectionView provides out of the box. Of course, you are free to implement any layout you want for a collection view. This is probably the most significant advantage a collection view has to offer.

You will build on top of Hello-Contacts by refactoring the existing application to switch from a table view to a collection view. You are going to replace all table-view-related configuration code with its collection view counterparts. You will also make use of a grid layout to show contacts. Lastly, you will create a custom collection view cell, just like you did for the table view.

To take the grid layout one step further than the default implementation, you will also explore UICollectionViewFlowLayout to implement a cool custom version of a grid that is a bit more playful than the default version. Since collection views and table views are so similar, you will also implement all of the features that existed for the table view version of the app.

This chapter covers the following topics:

Converting from a table view to a collection view
Creating a custom collection view cell
Using UICollectionViewFlowLayout
Creating a custom collection view layout
User interactions for UICollectionView