How to use UIPickerview and UIDatePicker on the same Viewcontroller? - ios

Question

I have three TextFields in a Viewcontroller. After clicking the first I want to use UIPickerview to select something. The second TF should open the keyboard and the third one should open 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
}
}
I can start the simulation and the UIPickerview works. Also the input on the keyboard at the second textfield. But if I open the datePicker and I click the done-button the display slides up from the bottom to the top with a transparent blue look.

Answer 1

Here are some screenshots:
Main screen
Program selection
Date selection
Bluescreen after clicking done