如何在同一个 Viewcontroller 上使用 UIPickerview 和 UIDatePicker？

Question

我在 Viewcontroller 中有三个 TextFields。 单击第一个后，我想使用 UIPickerview 来选择某些内容。 第二个 TF 应该打开键盘，第三个 TF 应该打开 UIDatepicker。

import UIKit

class NewCompetitionViewController: UIViewController, UITextViewDelegate,UIPickerViewDataSource, UIPickerViewDelegate{
    @IBOutlet weak var programTextField: UITextField!

    let program = ["Big Target - 60 Shots",
                   "Big Target - 30 Shots",
                   "Small Target - 40 Shots"]

    var selectedProgram: String?

    let datePicker = UIDatePicker()

    @IBOutlet weak var locationTextField: UITextField!
    @IBOutlet weak var dateTextField: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()

        createProgramPicker()
        createDatePicker()
    }

    @IBAction func saveButton(_ sender: UIButton) {
        dismiss(animated: true)
    }

    @IBAction func cancelButton(_ sender: UIButton) {
        dismiss(animated: true)
    }

    // PROGRAM PICKER
    func createProgramPicker(){
        let programPicker = UIPickerView()
        let toolBarPP = UIToolbar()

        programPicker.delegate = self

        // Customizations
        programPicker.backgroundColor = .white

        toolBarPP.sizeToFit()
        let spaceButtonPP = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
        let doneButtonPP = UIBarButtonItem(title: "Done", style: .plain, target: self, action: #selector(dismissKeyboard))

        toolBarPP.setItems([spaceButtonPP, doneButtonPP], animated: false)
        //toolBarPP.isUserInteractionEnabled = true

        programTextField.inputAccessoryView = toolBarPP
        programTextField.inputView = programPicker
    }

    // DISMISS KEYBOARD
    @objc func dismissKeyboard(){
        self.view.endEditing(true)
    }

    // DATE PICKER
    func createDatePicker(){
        datePicker.datePickerMode = .date
        datePicker.backgroundColor = .white

        let toolbarDP = UIToolbar()
        toolbarDP.sizeToFit()

        // flexible Space Button and Done button
        let spaceButtonDP = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
        let doneButtonDP = UIBarButtonItem(title: "Done", style: .plain, target: self, action: #selector(doneClicked))

        toolbarDP.setItems([spaceButtonDP, doneButtonDP], animated: false)
        //toolbarDP.isUserInteractionEnabled = true

        dateTextField.inputAccessoryView = toolbarDP
        dateTextField.inputView = datePicker
    }

    @objc func doneClicked(){
        let dateFormatter = DateFormatter()
        dateFormatter.dateFormat = "dd/MM/YYYY"
        dateFormatter.dateStyle = .medium
        dateFormatter.timeStyle = .none

        dateTextField.text = dateFormatter.string(from: datePicker.date)
        self.view.endEditing(true)
    }

    // Returns true after "Done" clicked
    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        // Hide the keyboard
        textField.resignFirstResponder()
        return true
    }

    private func textFieldDidEndEditing(_ textField: UITextField){
        locationTextField.text = textField.text
    }
}

extension NewCompetitionViewController: UIPickerViewDelegate, UIPickerViewDataSource {
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

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

    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        return program[row]
    }

    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
        selectedProgram = program[row]
        programTextField.text = selectedProgram
    }
}

我可以开始模拟并且 UIPickerview 工作。 也是键盘上第二个文本字段的输入。 但是，如果我打开 datePicker 并单击完成按钮，则显示会从底部向上滑动，并呈现透明的蓝色外观。

Answer 1

以下是一些截图：

主屏幕

节目选择

日期选择

点击完成后蓝屏