Swift UIImagePickerController

Demonstration of media selection from album and camera source

Uploading user photos and videos to a server is a common practice for customising a user’s profile or creating a post on social media. For example, Facebook, Twitter and WhatsApp, etc. Apple provides a simple-to-use tool UIImagePickerController to allow developers to implement this feature within the app in an easy way.

Developers can define the media type (photo or video) and the input source (user’s album or camera) of the file. Users can also crop the selected image and cut the selected video before sending it to the server.

This article will cover the setup procedures and the main properties of each media selection method. Hope this can help you learn more about media selection in iOS! Let’s start!

Select a Photo and Video from Album

Demonstration of selecting photo from album

Part 1— sourceType

Different kinds of source type — photoLibrary and savedPhotosAlbum

sourceType represents the origin of the files. It can be either:

1. photoLibrary (default) shows album selection page
2. savedPhotosAlbum shows the Moments page directly

Part 2— mediaTypes

Video and image are the two media types of UIImagePickerViewController

mediaTypes defines the types of file shown at the UIImagePickerViewController and can be one of the below:

1. UTType.image.identifier represents image source
2. UTType.video.identifier represents video source

Part 3 — allowEditing

Interface for editing media before submitting to the app

allowEditing means the user can edit the photo and video after selecting them. Image can be cropped and video can be cut.

Part 4 — Setting delegate

Source code of UIImagePickerController about the delegate property

The delegate property of the UIImagePickerController is in a special type. It is both UIImagePickerControllerDelegate and UINavigationControllerDelegate. The details will be discussed the later session.

Part 5 — Present UIImagePickerViewController

The final part is just simply presenting the UIImagePickerViewController as a normal UIViewController.

Capture photo and video

Demonstration of capturing media from camera source

Part 1: Camera & Microphone Permissions

Camera and microphone permissions are required to capture images and video from the camera source

Camera and microphone permission keys must be added to the info.plist

Camera and microphone permissions must be granted before taking photos or recording a video. The developer must declare the NSCameraUsageDescription and NSMicrophoneUsageDescription at the info.plist and the system will then handle the permission request for us.

Part 2 — mediaTypes

Different media types of UIImagePickerViewController in camera mode

mediaTypes defines the types of files captured by the camera.

Part 3: Camera settings

There are 3 standard camera parameters:

Camera settings

1. cameraCaptureMode: Either .photo (default) or .video. It defines whether photo or video is the initial media type when the camera is launched.
2. cameraDevice: Either .rear (default) or .front
3. cameraFlashMode: Can be .auto (default), .on or .off.

Part 4 — Other: allowEditing, setting delegate & presenting UIImagePickerViewController

Interface for editing media before submitting to app

Other properties are the same as the one for selecting media from the user’s album. Please refer to the previous session for more information.

UIImagePickerControllerDelegate

UIImagePickerControllerDelegate is used to handle the user’s actions, including confirmation and cancellation of media selection. There are only two callbacks of UIImagePickerControllerDelegate :

1. imagePickerController(_:didFinishPickingMediaWithInfo:)

This is the callback when the user has just selected or captured a media (after optionally editing the file).

The info contains all the data of the selected file and mediaType can be used to distinguish whether an image or video file is chosen. Different selected files return different information.

Original image and edited image can be retrieved back by the key originalImage and editedImage. Edited video URL can be retrieved by mediaURL.

2. imagePickerControllerDidCancel(_:)

Cancel button at the UIImagePickerViewController

This callback is triggered when the cancel button is pressed in either the media selection mode or capture mode.

In both callbacks of UIImagePickerControllerDelegate, it is developer’s responsibility to dismiss the UIImagePickerController when user confirms or cancel the selection.

Limitation

System camera app screenshot — Gridline and extra photo mode are shown

1. Only 1 file can be selected each time
2. The duration of captured video cannot be longer than 10 mins by default.
3. No grid line can be shown
4. Not all photo types can be supported by UIImagePickerViewController. For example, panorama, live photos, time-lapse and slow motion

Summary

1. UIImagePickerViewController provides an easy to use API for a user to select either photo or video from device. Media files can be selected or captured from the Moments, album or camera.
2. Camera and microphone permissions are required to record video and capture photos by the camera. Developers must declare the NSCameraUsageDescription and NSMicrophoneUsageDescription at the info.plist
3. The camera can be configured with capture mode, camera device and flash mode. However, there is no grid line and extra photo mode in UIImagePickerViewController.
4. Developer needs to dismiss UIImagePickerViewController once the user has confirmed or cancelled the media selection process.

Reference

1. Apple UIImagePickerViewController official documentation

Apple UIImagePickerViewController Developer Documentation

You are welcome to follow me at Twitter@myrick_chow for more information and articles. Thank you for reading this article. Have a nice day! 😄