Implementing the new outlets and displaying data

The initial view controller is now fully prepared to pass data along to the contact detail view controller. To display a contact, you will need to add a variable that holds on to the selected contact and a couple of outlets so you can update the view with the appropriate contact information. Add the following code to ContactDetailViewController to prepare it for displaying a contact:

@IBOutlet var contactPhoneLabel: UILabel!
@IBOutlet var contactEmailLabel: UILabel!
@IBOutlet var contactAddressLabel: UILabel!

var contact: Contact?

override func viewDidLoad() {
  // existing implementation...

  if let contact = self.contact {
    // 1
    contact.fetchImageIfNeeded { [weak self] image in
      self?.contactImage.image = image
    }

    contactNameLabel.text = "\(contact.givenName) \(contact.familyName)"
    contactPhoneLabel.text = contact.phoneNumber
    contactEmailLabel.text = contact.emailAddress
    contactAddressLabel.text = contact.address
  }
}

The preceding snippet configures the view controller so it uses contact data to populate its labels and image view. The comment in this snippet highlights the fetchImageIfNeeded(completion:) method that is used to retrieve and use the image.

The final step is to go to the storyboard, select the detail view controller, and connect the outlets in the Connections Inspector to the user interface elements. After doing this, build and run your app to see the details page in its full glory. Now, let's add some icing to this cake by implementing peek and pop using 3D Touch!