TextFieldと連携したDatePickerを二つ作る

#はじめに
　UIDatePickerを２つ作り、TextFieldにインプットする方法をまとめてみます。

#開発環境
macOS Catalina 10.15.7
Xcode 12.1
Swift 5.3

#テキストフィールドの設置と変数の準備
まず、テキストフィールド２つをStoryBoard上で任意の場所に設置します。
今回は１つ目のテキストフィールドをATextField、２つ目をBTextFieldとしました。

また、以下の2つの変数を用意します。

ViewController.swift

class ViewController: UIViewController { 
    @IBOutlet weak var ATextField: UITextField!
    @IBOutlet weak var BTextFiled: UITextField!

    var APicker: UIDatePicker!
    var BPicker: UIDatePicker!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
    }
}

#DatePickerを作成するメソッドの定義
次に、TextFieldに入れるDatePickerを作成するメソッドを定義します。

ViewController.swift

func makePicker(_ isA:Bool) -> UIDatePicker {
    let myPicker:UIDatePicker!
    myPicker = UIDatePicker()
    myPicker.tag = isA ? 1 : 2
    myPicker.datePickerMode = .date
    myPicker.locale = NSLocale(localeIdentifier: "ja_JP") as Locale
    myPicker.preferredDatePickerStyle = .wheels
        
    return myPicker
}

作成するDatePickerは２つあるので、引数にtrueかfalseをとる形にし、trueであればATextFieldに挿入するDatePickerが、falseであればBTextFiledに挿入するDatePickerが作成されます。

それぞれのDatePickerにタグを１、２とふっておきます。
DatePickerの設定についてはこのメソッド内で自由に設定します。

iOS14でのDatePickerの挙動についてはこちらの記事を参考にしました。
→https://qiita.com/kj_trsm/items/a53b0b3f7e1bc7c06106

#DatePickerの変更を検知するメソッドの定義

DatePickerがユーザーによって操作された際に入力された日付をテキストフィールドに表示するメソッドを定義します。

ViewController.swift

@objc internal func dateChanged(sender: UIDatePicker){
     let formatter: DateFormatter = DateFormatter()
     formatter.dateFormat = "yyyy年M月d日"
       
     let selectedDate = formatter.string(from: sender.date)
     if sender.tag == 1 {
         ATextField.text = selectedDate
     } else {
         BTextFiled.text = selectedDate
     }
   
 }

まずDate型をString型に変換するDateFormatterを用意し、変換した文字列をselectedDate変数に格納した後、senderのタグに従って入力先のテキストフィールドに文字列を代入します。

ここまでできたら、先ほど定義したmakePickerメソッド内で、myPickerにaddTargetします。

ViewController.swift

func makePicker(_ isA:Bool) -> UIDatePicker {
    let myPicker:UIDatePicker!
    myPicker = UIDatePicker()
    myPicker.tag = isA ? 1 : 2
    myPicker.datePickerMode = .date
    myPicker.locale = NSLocale(localeIdentifier: "ja_JP") as Locale
    myPicker.preferredDatePickerStyle = .wheels
       
    //ここ 
    myPicker.addTarget(self, action:  #selector(onDidChangeDate(sender:)), for: .valueChanged)
        
    return myPicker
 }

#キーボードを引っ込ませる処理
このままだと、DatePickerの操作を始めるとキーボードが出っ放しになるので、
キーボード外をタップするとキーボードが引っ込む処理を行います。

ViewController.swift

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    ATextField.endEditing(true)
    BTextFiled.endEditing(true)
}

#ViewDidLoad内でDatePickerを作成
最後に、ViewDidLoad内でDatePickerを作成するメソッドを呼び、テキストフィールドにインプットして完成です。

ViewContoller.swift

override func viewDidLoad() {
    super.viewDidLoad()
        
    APicker = makePicker(true)
    ATextField.inputView = APicker
        
    BPicker = makePicker(false)
    BTextFiled.inputView = BPicker
        
    }

#コード全体

ViewCOntroller.swift

class ViewController: UIViewController {
    @IBOutlet weak var ATextField: UITextField!
    @IBOutlet weak var BTextFiled: UITextField!
    
    var APicker: UIDatePicker!
    var BPicker: UIDatePicker!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        APicker = makePicker(true)
        ATextField.inputView = APicker
        
        BPicker = makePicker(false)
        BTextFiled.inputView = BPicker
        
    }
    
    func makePicker(_ isA:Bool) -> UIDatePicker {
        let myPicker:UIDatePicker!
        myPicker = UIDatePicker()
        myPicker.tag = isA ? 1 : 2
        myPicker.datePickerMode = .date
        myPicker.locale = NSLocale(localeIdentifier: "ja_JP") as Locale
        myPicker.preferredDatePickerStyle = .wheels
        
        myPicker.addTarget(self, action:  #selector(onDidChangeDate(sender:)), for: .valueChanged)
        
        return myPicker
    }
    
    @objc internal func onDidChangeDate(sender: UIDatePicker){
        let formatter: DateFormatter = DateFormatter()
        formatter.dateFormat = "yyyy年M月d日"
        
        let mySelectedDate = formatter.string(from: sender.date)
        if sender.tag == 1 {
            ATextField.text = mySelectedDate
        } else {
            BTextFiled.text = mySelectedDate
        }
    }
    
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        ATextField.endEditing(true)
        BTextFiled.endEditing(true)
    }


}