[5장] Picker View

Picker View

아이폰을 사용하다 보면 만나게 되는 아래 화면이 Picker view입니다.

출처 : https://www.ioscreator.com/tutorials/picker-ios-tutorial

 

Picker View 적용하기

Picker View를 사용하기 위해서는 delegate method를 이용해야 합니다.

View controller에서 picker view에 대한 delegate method를 사용한다고 설정합니다.

ViewController에 UIPickerViewDelegate, UIPickerViewDataSource를 상속받습니다.

아래 코드처럼 용도에 맞는 delegate method를 이용하면 됩니다.

import UIKit

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {
    let MAX_ARRAY_NUM = 10
    let PICKER_VIEW_COLUMN = 2
    let PICKER_VIEW_HEIGHT: CGFloat = 80
    var imageArray = [UIImage?]()
    var imageFileName = ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg", "6.jpg", "7.jpg", "8.jpg", "9.jpg", "10.jpg"]
    
    @IBOutlet var pickerImage: UIPickerView!
    @IBOutlet var lblImageFileName: UILabel!
    @IBOutlet var imageView: UIImageView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        for i in 0 ..< MAX_ARRAY_NUM {
            let image = UIImage(named: imageFileName[i])
            imageArray.append(image)
        }
        
        updateImage(0)
    }
    
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return PICKER_VIEW_COLUMN
    }
    
    func pickerView(_ pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {
        return PICKER_VIEW_HEIGHT
    }
    
    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        return imageFileName.count
    }
  
    func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
        let imageView = UIImageView(image: imageArray[row])
        imageView.frame = CGRect(x: 0, y: 0, width: 100, height: 150)
        return imageView
    }
    
    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
        if (component == 0) {
            lblImageFileName.text = imageFileName[row]
        } else {
            imageView.image = imageArray[row]
        }
        
    }
    
    fileprivate func updateImage(_ row: Int) {
        lblImageFileName.text = imageFileName[row]
        imageView.image = imageArray[row]
    }
}

 

 

이번 내용은 delegate 개념 자체가 생소한 챕터입니다.

책에서는 picker view 이용에 초점이 맞춰져서, delegate pattern을 자세히 설명하지 않습니다.

이후 따로 더 공부할 예정입니다.