同じビュー内に違う値を持つPickerViewを2つ表示する

画像のように年月日と時間をPickerViewで入力できるようなオブジェクトを設置したいと考えています。

このホームページを参考にしてキーボード入力時にデートピッカーが表示するオブジェクトを設置しました。
https://qiita.com/Takarkiz/items/5b559a63598e3d641c3a

さらに以下のホームページを参考にして、tagをつけて同じビュー内に違う値を持つPickerViewを設置しようとしたところ、出来ませんでした。
https://teratail.com/questions/59982

教えていただきたいこと
①同じビュー内に違う値を持つPickerViewを2つ表示する方法

swift
1import UIKit
2class testViewController: UIViewController, UITextFieldDelegate{
3
4var toolBar:UIToolbar!
5
6    
7    @IBOutlet weak var wakeTimeTextField: UITextField!
8    
9    @IBOutlet weak var textfield2: UITextField!
10    override func viewDidLoad() {
11    super.viewDidLoad()
12
13    wakeTimeTextField.tag = 1
14    wakeTimeTextField.delegate = self
15    setupToolbar()
16    
17    textfield2.tag = 2
18        textfield2.delegate = self
19}
20func setupToolbar() {
21        //datepicker上のtoolbarのdoneボタン
22        toolBar = UIToolbar()
23        toolBar.sizeToFit()
24        let toolBarBtn = UIBarButtonItem(title: "DONE", style: .plain, target: self, action: #selector(doneBtn))
25        toolBar.items = [toolBarBtn]
26        wakeTimeTextField.inputAccessoryView = toolBar
27}
28
29func textFieldDidBeginEditing(_ textField: UITextField) {
30    if wakeTimeTextField.tag == 1{
31    let datePickerView:UIDatePicker = UIDatePicker()
32    datePickerView.datePickerMode = UIDatePicker.Mode.date
33    textField.inputView = datePickerView
34        datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)}else{
35        let datePickerView:UIDatePicker = UIDatePicker()
36        datePickerView.datePickerMode = UIDatePicker.Mode.time
37        textField.inputView = datePickerView
38            datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)}
39}
40
41    //datepickerが選択されたらtextfieldに表示
42@objc func datePickerValueChanged(sender:UIDatePicker) {
43    if wakeTimeTextField.tag == 1{
44    let dateFormatter = DateFormatter()
45    dateFormatter.dateFormat  = DateFormatter.dateFormat(fromTemplate: "yMMMdE", options: 0, locale: Locale(identifier: "ja_JP"))
46        wakeTimeTextField.text = dateFormatter.string(from: sender.date)}else
47    {
48    let dateFormatter = DateFormatter()
49    dateFormatter.dateFormat  = DateFormatter.dateFormat(fromTemplate: "H:mm", options: 0, locale: Locale(identifier: "ja_JP"))
50        textfield2.text = dateFormatter.string(from: sender.date)}
51}
52
53//toolbarのdoneボタン
54@objc func doneBtn(){
55    wakeTimeTextField.resignFirstResponder()
56}
57}
58

追記です。

swift
1
2
3import UIKit
4class testViewController: UIViewController, UITextFieldDelegate{
5
6var toolBar:UIToolbar!
7
8    
9    @IBOutlet weak var wakeTimeTextField: UITextField!
10    
11    @IBOutlet weak var textfield2: UITextField!
12    override func viewDidLoad() {
13    super.viewDidLoad()
14
15    wakeTimeTextField.tag = 1
16    wakeTimeTextField.delegate = self
17    setupToolbar()
18    
19    textfield2.tag = 2
20        textfield2.delegate = self
21}
22func setupToolbar() {
23        //datepicker上のtoolbarのdoneボタン
24        toolBar = UIToolbar()
25        toolBar.sizeToFit()
26        let toolBarBtn = UIBarButtonItem(title: "DONE", style: .plain, target: self, action: #selector(doneBtn))
27        toolBar.items = [toolBarBtn]
28        wakeTimeTextField.inputAccessoryView = toolBar
29}
30
31func textFieldDidBeginEditing(_ textField: UITextField) {
32    if wakeTimeTextField.tag == 1{
33    let datePickerView:UIDatePicker = UIDatePicker()
34        
35        datePickerView.tag = 1//追加
36        
37    datePickerView.datePickerMode = UIDatePicker.Mode.date
38    textField.inputView = datePickerView
39        datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)}else{
40        let datePickerView:UIDatePicker = UIDatePicker()
41        
42        datePickerView.tag = 2//追加
43        
44        
45        datePickerView.datePickerMode = UIDatePicker.Mode.time
46        textField.inputView = datePickerView
47            datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)}
48}
49
50    //datepickerが選択されたらtextfieldに表示
51@objc func datePickerValueChanged(sender:UIDatePicker) {
52    
53    if sender.tag == 1{//変更
54        
55    let dateFormatter = DateFormatter()
56    dateFormatter.dateFormat  = DateFormatter.dateFormat(fromTemplate: "yMMMdE", options: 0, locale: Locale(identifier: "ja_JP"))
57        wakeTimeTextField.text = dateFormatter.string(from: sender.date)}else
58    {
59    let dateFormatter = DateFormatter()
60    dateFormatter.dateFormat  = DateFormatter.dateFormat(fromTemplate: "H:mm", options: 0, locale: Locale(identifier: "ja_JP"))
61        textfield2.text = dateFormatter.string(from: sender.date)}
62}
63
64//toolbarのdoneボタン
65@objc func doneBtn(){
66    wakeTimeTextField.resignFirstResponder()
67}
68}
69

行動規範の内容に同意します

回答1件

ベストアンサー

曜日の漢字名については別の方が解決されることを期待して...

2つのPickerViewを使う方法として、流れは間違っていないと思いますが、tagをうまく活用されていないように思えます。

2つの独立したTextFieldの処理を一つのtextFieldDidBeginEditing()で処理させるのは良いのですが、どのタグから送られてきたのか判別するのは、このメソッドの引数であるtextFieldのtagを見る必要があります。

DatePickerの処理の流れも同じです。

swift
1func setupToolbar() {
2        // 中略
3        // 時間を入れるテキストフィールドのアクセサリビューも設定する（共用する）
4        textfield2.inputAccessoryView =  toolBar
5    }
6    
7    func textFieldDidBeginEditing(_ textField: UITextField) {
8        // ここは、この関数の引数(textField.tag)を使う
9        if textField.tag == 1 {
10            let datePickerView:UIDatePicker = UIDatePicker()
11            //　ここで作成したdatePockerにもタグをつける.
12            // 番号はテキストフィールドのtagに合わせる
13            datePickerView.tag = 1
14            // 略
15        } else {
16            let datePickerView:UIDatePicker = UIDatePicker()
17            //　同じくタグをつける
18            datePickerView.tag = 2
19            // 略            
20　　　　　}
21
22        // 上の行はこのようにまとめて処理することも可能
23        // let datePickerView: UIDatePicker = UIDatePicker()
24        //
25        // datePickerView.tag = textField.tag
26        // タグの番号によって DataPicker の表示内容を変える
27        // datePickerView.datePickerMode = textField.tag == 1 ? .date : .time
28        // textField.inputView = datePickerView
29        // datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)
30    }
31    
32    //datepickerが選択されたらtextfieldに表示
33    @objc func datePickerValueChanged(sender:UIDatePicker) {
34        // sender のタグで判断する
35        if sender.tag == 1{
36            // 略
37        } else {
38            // 略
39        }
40    }
41    
42    //toolbarのdoneボタン
43    @objc func doneBtn(){
44        // どちらのテキストフィールドが押された場合でもピッカービューを消す
45        view.endEditing(true)
46    }

textFieldDidBeginEditing(_)の中はこんな感じになります。

func textFieldDidBeginEditing(_ textField: UITextField) {
        // ここは、この関数の引数を使う
        if textField.tag == 1 {
            let datePickerView:UIDatePicker = UIDatePicker()
            //　ここで作成したdatePockerにもタグをつける.
            // 番号はテキストフィールドのtagに合わせる
            datePickerView.tag = 1
            datePickerView.datePickerMode = UIDatePicker.Mode.date
            textField.inputView = datePickerView
            datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)
        } else {
            let datePickerView:UIDatePicker = UIDatePicker()
            //　同じくタグをつける
            datePickerView.tag = 2
            datePickerView.datePickerMode = UIDatePicker.Mode.time
            textField.inputView = datePickerView
            datePickerView.addTarget(self, action: #selector(datePickerValueChanged(sender:)), for: UIControl.Event.valueChanged)
        }
    }

投稿2020/04/20 05:36

編集2020/04/20 08:53

TsukubaDepot

総合スコア5086

Daisuke0315

2020/04/20 08:44

お返事ありがとうございます。なるほど、datepickerに対してもタグ付けが必要だったんですね！取り急ぎコードの追加・変更などしてみたのですが現象はかわりませんでした。他になにか原因があるのでしょうか・・・。私のケアレスミスの可能性もあるため、コードを追記します。ご査収よろしくおねがいします。

TsukubaDepot

2020/04/20 08:56

textFieldDidBeginEditing(_)の中が違いますね。私の例がちょっとわかりにくかったかもしれません。省略していないバージョンを回答に追記していますので、そちらとよく見比べてみてください。ところで、Swiftはインデントそのものは動作にほとんど関係しませんが、それでも目で見える範囲で間違いに気づくためにはインデントすることは重要だと思っています。提示していただいたコードはインデントが崩れているため、すぐに間違いに気付きにくくなっています。インデントを整えたい部分をドラッグして（範囲指定して）Control+I を押すか、それとも Cmd+A（全部選択）のあと Control+I を押すとインデントを自動で修正してくれますので、是非その機能も活用してみてください。

Daisuke0315

2020/04/20 09:24

すみません理解出来ていなかったです。教えていただきありがとうございます。しっかり中身を理解出来ていないので噛み砕いて消化していきたいと思います。インデントの校正についても知らなかったので今後はしっかり活用して、みやすく拡張性の高いコードを書けるようにしたいと思います。今後も質問させていきたいと思っていますので今後ともよろしくおねがいします。

TsukubaDepot

2020/04/20 09:41

コメントありがとうございます。曜日を漢字にする件が未解決なのにBAをいただくのはちょっと恐縮なのですが... この問題が解決済みになってしまって、曜日の問題が他の方から見えなくなるので、曜日の件だけ独立して新たに一つ質問を作られることをお勧めします（コードだけでなく、iPhoneの設定も絡んでくるので、結構難儀するかもしれませんが、解決方法はあるはずです）。

Daisuke0315

2020/04/20 11:40

承知しました。試行錯誤してみます、またわからなければ質問しようと思います。

行動規範の内容に同意します