[Swift5]時間を設定できるtimePickerを作ろう[キーボード版]

公開日：2019/11/10

はじめに

StoryBoardでPickerを設置すると、画面に直接置かれます。

画像のような設定でtimePickerは作成することは可能です。

しかし、このままでは少々扱いづらいですよね？
したがって、今回は、textFieldをタップするとtimePickerがキーボードとして現れるようにして作成していきます。

以下のようなものを作ります

Code

@IBOutlet weak var timeTextField: UITextField!
override func viewDidLoad() {
    super.viewDidLoad()

    timeTextField.delegate = self
    
    //キーボードをtimePickerに変更
    timeTextField.inputView = timePicker
}
    //UIDatePickerをインスタンス化
    let timePicker: UIDatePicker = {
        let dp = UIDatePicker()
        dp.datePickerMode = UIDatePicker.Mode.time
        dp.timeZone = NSTimeZone.local
        //時間をJapanese(24時間表記)に変更
        dp.locale = Locale.init(identifier: "Japanese")
        dp.addTarget(self, action: #selector(dateChange), for: .valueChanged)
        //最小単位（分）を設定
        dp.minuteInterval = 10
        return dp
    }()
    @objc func dateChange(){
        let formatter = DateFormatter()
        formatter.dateFormat = "hh:mm"
        timeTextField.text = "\(formatter.string(from: timePicker.date))"
    }