You will modify RestaurantListViewController in order to adopt the collection view data source and delegate protocols and add the required protocol methods. You'll also add an outlet for the collection view and make RestaurantListViewController the view controller for the view. Go through the following steps:

1. Modify the RestaurantListViewController class declaration, as shown in the following code, to adopt the UICollectionViewDataSource and UICollectionViewDelegate protocols:

class RestaurantListViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate {   

2. When the error icon appears, click it.
3. You can see this error because the methods that are required to conform to the protocols you just added are not present in the class definition. Click the Fix button to add protocol stubs to your class.

4. Now, the stubs for the required methods have been added to the file. Rearrange everything so that the stubs will be at the bottom of the file, as shown in the following screenshot:

5. Modify the code, as shown in the following code fragment, to make the collection view display a single collection view cell on the screen when the app is run:

func collectionView(_ collectionView: UICollectionView, 
  numberOfItemsInSection section: Int) -> Int {
    1
}
 
func collectionView(_ collectionView: UICollectionView, 
  cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    return collectionView.dequeueReusableCell(withReuseIdentifier: 
       "restaurantCell", for: indexPath)
}

6. Your code should look like this:

7. Add an outlet, collectionView, just under the class declaration. You will link this to the collection view in the storyboard later:

@IBOutlet weak var collectionView: UICollectionView!

8. Your code should look like this:

Note that you won't be using the assistant editor like you did in the previous chapter. This is a matter of personal preference—you are free to choose whichever method suits you best.

9. Click Main.storyboard and click the View Controller icon of the newly added View Controller Scene in the Document Outline. Then, click the Identity inspector:

10. Select RestaurantListViewController in the Class field:

11. Note that the name of the View Controller Scene has changed to Restaurant List View Controller Scene. Click the Connections inspector. In the Outlets section, drag the circle next to the collectionView outlet to the Collection View in the Restaurant List View Controller Scene:

12. The Collection View in the Restaurant List View Controller Scene and the collectionView outlet in RestaurantListViewController are now connected:

13. Click the Collection View in the document outline. In the Outlets section of the Connections inspector, drag from the circles next to the dataSource and delegate outlets to the Restaurant List View Controller icon in the document outline:

14. The dataSource and delegate outlets are now connected:

15. Click the Collection View Cell in the document outline. Click the Attributes inspector:

16. Set the Identifier of the Collection View Cell to restaurantCell and set the Background color to Demo Grey:

The Restaurant List View Controller Scene setup is now complete. Now, you need to display this screen when a cell in the Explore screen is tapped. To do this, you will need to add a segue to exploreCell, which you will do in the next section.