If your app interacts with files, such as email attachments or photos, allowing users to preview those files without leaving your app is a great way to enhance the user’s experience. Fortunately, iOS makes adding this feature simple by providing the document interaction controller and the Quick Look preview controller. In this post, you will learn the differences between the two options and how you can implement them in your app.

All the code below is available as a sample app on GitHub.

Document Interaction Controller

The document interaction controller is the more straightforward option to implement. As the name suggests, not only can it be used for previewing, it can also enable other file interactions, such as opening with another app, copying, or printing.

To use the document interaction controller, start by creating a class that inherits from UIDocumentInteractionControllerDelegate. While most of the delegate methods are optional, in order to enable previewing you must override the ViewControllerForPreview method. This method must return a view controller that the document interaction controller can use as its parent. You can define a constructor with a UIViewController parameter so you can pass in the parent view controller:

When you are ready to present the preview, create a new document interaction controller by using the UIDocumentInteractionController.FromUrl method and passing it the path to the file. Then set its Delegate property to a new instance of the class above and call PresentPreview:

Gif demonstrating the document interaction controller opening a preview of a pdf document followed by a photo

Other Interaction Options

As mentioned earlier, the document interaction controller offers more than just previews. Calling PresentOptionsMenu instead will present a menu with apps installed that can open the file and other options such as copying or printing the file. PresentOpenInMenu is similar except it will only show the list of apps that can open the file.

Screenshot of menu options for PresentOptionsMenu and PresentOpenInMenu

Menu options for PresentOptionsMenu (left) and PresentOpenInMenu (right)

Quick Look Preview Controller

Unlike the document interaction controller, the Quick Look preview controller can only preview files. It also requires a data source, however, the benefit of this is that it can preview multiple files at the same time.

To begin, create a class that inherits from QLPreviewControllerDataSource. You will need to override the following methods:

  • PreviewItemCount – returns an nint for the number of files to be previewed.
  • GetPreviewItem – returns the current preview item. The object must implement IQLPreviewItem in order to provide the controller the path to the file.

Create a new class inheriting from QLPreviewItem and override the ItemUrl method to return the file’s path. You can also override ItemTitle if you want to customize the title that is shown for the preview.

To present a preview, create a new QLPreviewController and set DataSource to you data source class. Since the controller can preview multiple files, make sure to set CurrentPreviewItemIndex before navigating to the controller:

Gif showing the Quick Look controller opening a preview of multiple files

Wrap up

Adding file previews to your app can be a quick and simple way to increase user engagement in your app. This post gave you an overview on how to get started with file previews so check out Apple’s documentation to learn even more about interacting with documents on iOS. Happy coding!