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

时间:2019-06-24 17:30:22

标签: ios swift uipickerview uidatepicker

我在Viewcontroller中有三个TextField。单击第一个之后,我想使用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并单击完成按钮,则显示会以透明的蓝色外观从底部向上滑动到顶部。

1 个答案:

答案 0 :(得分:0)