えむじぃのアプリ開発

えむじぃのアプリ開発

元大手IT企業SE、現ベンチャー企業CTOのブログです。

【Swift】UITextFieldにUIPickerViewを設定する方法

今回はUITextFieldにUIPickerViewを設定する方法をこの記事で説明します。

この記事のポイント・UIPickerViewDelegate、UIPickerViewDataSourceを使用

UITextFieldにUIPickerViewを設定する方法

UIPickerViewを設定するには以下のように設定します。

import UIKit

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {

    @IBOutlet weak var txField: UITextField!

    var pickerView: UIPickerView = UIPickerView()
    let idlist = ["000001", "000002", "000003", "000004", "000005", "000006", "000007", "000008", "000009", "000010"]

    override func viewDidLoad() {
        super.viewDidLoad()

        pickerView.delegate = self
        pickerView.dataSource = self
        pickerView.showsSelectionIndicator = true

        let toolbar = UIToolbar(frame: CGRectMake(0, 0, 0, 35))
        let doneItem = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(ViewController.done))
        let cancelItem = UIBarButtonItem(barButtonSystemItem: .cancel, target: self, action: #selector(ViewController.cancel))
        toolbar.setItems([cancelItem, doneItem], animated: true)

        self.txField.inputView = pickerView
        self.txField.inputAccessoryView = toolbar
    }

    // UIPickerViewDelegate と UIPickerViewDataSource を継承すると以下の関数が必要になる
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        return idlist.count
    }

    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        return idlist[row]
    }
    // ここまで

    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
        self.txField.text = idlist[row]
    }

    func cancel() {
        self.txField.text = ""
        self.txField.endEditing(true)
    }

    func done() {
        self.txField.endEditing(true)
    }

    func CGRectMake(_ x: CGFloat, _ y: CGFloat, _ width: CGFloat, _ height: CGFloat) -> CGRect {
        return CGRect(x: x, y: y, width: width, height: height)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
        
    }
}

これでUITextFieldにUIPickerViewが設定されます。