24
26

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Swift5】iPhoneの画像を読み込み、UIImageViewに表示する

Last updated at Posted at 2019-04-14

初心者が実装できるとちょっぴり嬉しいポイントだと思うので、備忘録として記載します。

環境

  • X-code10.2
  • Swift5
  • 対象OS 12.0

1.info.plistに登録する

ListにNSPhotoLibraryUsageDescriptionのキーを追加し、
Valueにカメラロールの使用目的を記載します。

スクリーンショット 2019-04-14 18.03.05.png

2.実装する

スクリーンショット 2019-04-14 18.17.15.png

部品はStoryBoardに適当に配置しました。

ViewController.swift
import UIKit

final class ViewController: UIViewController {

    @IBOutlet weak var imageView: UIImageView! {
        didSet {
            // デフォルトの画像を表示する
            imageView.image = UIImage(named: "no_image.png")
        }
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }

    @IBAction func selectPicture(_ sender: UIButton) {
        // カメラロールが利用可能か?
        if UIImagePickerController.isSourceTypeAvailable(.photoLibrary) {
            // 写真を選ぶビュー
            let pickerView = UIImagePickerController()
            // 写真の選択元をカメラロールにする
            // 「.camera」にすればカメラを起動できる
            pickerView.sourceType = .photoLibrary
            // デリゲート
            pickerView.delegate = self
            // ビューに表示
            self.present(pickerView, animated: true)
        }
    }
    
    @IBAction func deletePicture(_ sender: UIButton) {
        // アラート表示
        showAlert()
    }
    
    /// アラート表示
    func showAlert() {
        let alert = UIAlertController(title: "確認",
                                      message: "画像を削除してもいいですか?",
                                      preferredStyle: .alert)
        let okButton = UIAlertAction(title: "OK",
                                     style: .default,
                                     handler:{(action: UIAlertAction) -> Void in
                                        // デフォルトの画像を表示する
                                        self.imageView.image = UIImage(named: "no_image.png")
        })
        let cancelButton = UIAlertAction(title: "キャンセル", style: .cancel, handler: nil)
        
        // アラートにボタン追加
        alert.addAction(okButton)
        alert.addAction(cancelButton)
        
        // アラート表示
        present(alert, animated: true, completion: nil)
    }
}

extension ViewController: UIImagePickerControllerDelegate, UINavigationControllerDelegate {
    // 写真を選んだ後に呼ばれる処理
    func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
        // 選択した写真を取得する
        let image = info[.originalImage] as! UIImage
        // ビューに表示する
        imageView.image = image
        // 写真を選ぶビューを引っ込める
        self.dismiss(animated: true)
    }
}

初回起動画面はこんな感じ
IMG_9846.PNG

「写真を選択」ボタンを押下するとカメラロールが表示されます
IMG_9838.JPG

選択した画像がUIImageViewに表示されます
IMG_9848.PNG

「写真を削除」ボタンを押下し、OKボタンを選択すると画像が削除されます
IMG_9849.PNG

表示するだけならとても簡単みたい!

ご指摘などあれば、コメントお願いいたします。

参考

24
26
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
24
26

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?