How to Access the Camera and Photo Library in SwiftUI?

Today's life mobile cameras are playing a very important role in almost every application. Some examples are Updating profile Pics, Sending Photos, Scanning PDFs, etc. So, for an iOS developer, it is very basic to know how to integrate the camera with an iOS app.

Let’s learn how to integrate Camera in an iOS app.

As there is no native SwiftUI method to open Camera, we are going to use UIKit’s UIImagePickerController and wraps it in UIViewControllerRepresentable struct. Then we can use that struct as SwiftUI view.

Note: Camera only works on a real iOS device.

The process has 4 steps,

1. Add camera permission in info.plist file
2. Create a struct which confirms UIViewControllerRepresentable
3. Create a Coordinator class for fetching the captured image from Camera
4. Display the image in Content view

Add camera permission in info.plist file

Open info.plist file → Click + button → Select “Privacy — Camera Usage Description” → Enter description message for camera permission alert

After completing the step, your info.plist will be looks like this

Create a struct which confirms UIViewControllerRepresentable

As we mentioned previously, SwiftUI doesn’t support Camera natively. So we need to create UIImagePickerController and wrap it in a struct which confirms UIViewControllerRepresentable.

Here, we have created a struct called ImagePickerView which confirms, UIViewControllerRepresentable (this is helps us to use UIKit in SwiftUI) protocol.

We need to implement “makeUIViewController”, “updateUIViewControlller” methods in the struct.

Normally, makeUIViewController method will return an UIViewController. In our case, it is going to return UIImagePickerController. and updateUIViewController is used to configure the view and responds to any changes.

imagePicker.sourceType is where we are defining whether the image is taken from the photo library or camera. In our case, we will get it later.

Create a Coordinator class for fetching the captured image from Camera

Now, we need to create a coordinator class which is used to get the image data captured from the camera or selected in photo library. It acts as a bridge between the UIKit and SwiftUI.

Here, we have created a class extending NSObject, UINavigationControllerDelegate, UIImagePickerControllerDelegate.

we have declared picker variable which is nothing but the ImagePickerView struct we have created in the previous step and we are initialising it in init() method.

Next, we need to implement the below method now,

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any])

This method is coming from UIImagePickerControllerDelegate. This method will be triggered when the user captured a pic using Camera or when the user selects an image from the photo library. Inside this method, we are getting the image from info[.originalImage] and converting the image into a UIImage object. Then assigning that to “selectedImage” variable of ImagePickerView (picker) object.

After the implementation of Coordinator class, we need to modify a single line in the ImagePickerView struct’s makeUIViewController method and add a new method called makeCoordinator.

Now, ImagePickerView will be looks like below,

Display the image in Content view

Now, we have ImagePickerView struct which will act like a normal SwiftUI view. Let’s modify the ContentView.

In the ContentView, we are using the ImagePickerView in a sheet. We have two buttons here, one for Camera and one for Photo. If we tap on “Camera” button, self.sourceType will be set as .camera and if we tap on “Photo” button, self.sourceType will be set as .photolibrary

Final OutCome will be…

Hope you have liked this article.

Thank you 🙏👨‍💻