iOS Tutorials: Images from Album/Camera

There are several ways to upload an image either by taking picture using your camera or selecting images from the photo albums. We will be doing both for this. In order to do that, we will using protocol such as UIImagePickerControllerDelegate & UINavigationControllerDelegate

After creating new projects, go to Main.storyboard and drag Image Picker & Button onto the layout. 

Since we will be accessing the user’s camera and photo album, we will have to ask permission from the user. If you would like to have split screen like mine,  click Alt + Info.plist. Click + and add Privacy – Camera Usage Description & Privacy – Photo Library Usage Description. If you don’t add this, you will problem accessing camera and photo album. 

Now, lets go to the coding section and include the protocol and connect each code. We will be inheriting the function of UIImagePickerController by creating a variable. UIImagePickerController is another essential tool in taking picture and selecting pictures.

class ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {

    var imagePicker: UIImagePickerController!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        imagePicker = UIImagePickerController()
        imagePicker.delegate = self
        
    }
}

Connect the Image View and the Button. With Image View, create a @IBOutlet and with button, create @IBAction. Declare a variable with

We are hoping that with each click on the button, we are able to select to use either from camera or photo album. We will be using Action Sheet here to address that issue.

@IBAction func changeImage(_ sender: Any) {
    let alert = UIAlertController(title: "Select Your Image", message: "Pick from album or take photo", preferredStyle: .actionSheet)
        
    let album = UIAlertAction(title: "Pick from Album", style: .default, handler: {
            (action) -> Void in
    })
        
    let camera = UIAlertAction(title: "Take a Picture", style: .default, handler: {
            (action) -> Void in
    })
        
    let cancel = UIAlertAction(title: "Cancel", style: .cancel, handler: {
            (action) -> Void in
    })
        
    alert.addAction(album)
    alert.addAction(camera)
    alert.addAction(cancel)
        
    self.present(alert, animated: true, completion: nil)
}

If you run your application and click on the button, this is how an action sheet will look like. It will not do anything yet because we have not implement any action yet.

Now we are going to create a camera function. With the code below, you could now launch a camera and use the image below.

func useCamera() {
    imagePicker.allowsEditing = false
    imagePicker.sourceType = UIImagePickerControllerSourceType.camera
    imagePicker.cameraCaptureMode = .photo
    imagePicker.modalPresentationStyle = .fullScreen
    present(imagePicker, animated: true, completion: nil)
}

One last code to implement is the code below which tells the delegate the user picked a still image.

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
    if let img = info[UIImagePickerControllerOriginalImage] as? UIImage {
        imageView.image = img
    }
    imagePicker.dismiss(animated: true, completion: nil)
}

Now, we just need to modify the code a little bit and include the functionality that will enable the camera and selecting an image from photo album.

@IBAction func changeImage(_ sender: Any) {
    let alert = UIAlertController(title: "Select Your Image", message: "Pick from album or take photo", preferredStyle: .actionSheet)
        
    let album = UIAlertAction(title: "Pick from Album", style: .default, handler: {
            (action) -> Void in
       self.present(self.imagePicker, animated: true, completion: nil)
    })
        
    let camera = UIAlertAction(title: "Take a Picture", style: .default, handler: {
            (action) -> Void in
       self.useCamera()
    })
        
    let cancel = UIAlertAction(title: "Cancel", style: .cancel, handler: {
            (action) -> Void in
    })
        
    alert.addAction(album)
    alert.addAction(camera)
    alert.addAction(cancel)
        
    self.present(alert, animated: true, completion: nil)
}

To use the camera, you will have to plug in your iPhone. Other than that, your simulator should be able to retrieve image from your photo album.

The project could be found on Github

  • Article By :
    Founder of DaddyCoding. Studied Computer Science, Information System and Information Technology at BYU-Hawaii. Currently spending most of my time researching and learning on helping to expose making iOS apps.

Random Posts

Leave a Reply

Your email address will not be published. Required fields are marked *

*
*