CODEWITHSUNDEEP
swiftdatepickerstoryboardtoolbarios14
Serj Semenov
Serj Semenov

Reputation: 267

iOS 14 bug with date picker toolbar

The toolbar is higher than the date picker, is this a bug? or I do something wrong?

My code:

class ViewController: UIViewController {
    
    @IBOutlet weak var textField: UITextField!
    
    let datePicker = UIDatePicker()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        showDatePicker()
    }
    
    func showDatePicker(){
        //Formate Date
        datePicker.datePickerMode = .date
        datePicker.preferredDatePickerStyle = .compact
        
        //ToolBar
        let toolbar = UIToolbar();
        toolbar.sizeToFit()
        let doneButton = UIBarButtonItem(title: "Done", style: .plain, target: self, action: #selector(donedatePicker));
        let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: nil, action: nil)
        let cancelButton = UIBarButtonItem(title: "Cancel", style: .plain, target: self, action: #selector(cancelDatePicker));
        
        toolbar.setItems([doneButton,spaceButton,cancelButton], animated: false)
        
        textField.inputAccessoryView = toolbar
        textField.inputView = datePicker
        
    }
    
    @objc func donedatePicker(){
        
        let formatter = DateFormatter()
        formatter.dateFormat = "dd/MM/yyyy"
        textField.text = formatter.string(from: datePicker.date)
        self.view.endEditing(true)
    }
    
    @objc func cancelDatePicker(){
        self.view.endEditing(true)
    }
}

Yes I know that I can go back to preferredDatePickerStyle = .wheels, but Its Interesting why does it acting like this

Upvotes: 6

Views: 5230

Answers (4)

Robocon
Robocon

Reputation: 17

You can try it

 if #available(iOS 13.4, *) {
    datePicker.preferredDatePickerStyle = .wheels
    datePicker.backgroundColor = UIColor.white
 }

Upvotes: 2

Muhammad Humza Khan
Muhammad Humza Khan

Reputation: 271

You can achieve your requirement from this

Objective C

 if (@available(iOS 13.4, *)) {
        datePicker.preferredDatePickerStyle = UIDatePickerStyleWheels;
        [datePicker sizeToFit];
    }

In Swift

    if #available(iOS 13.4, *) {
        datePicker.preferredDatePickerStyle = .wheels
        datePicker.sizeToFit()
    }

Upvotes: 11

stm apps
stm apps

Reputation: 61

To set UIDatePicker.preferredDatePickerStyle to .wheels is necessary indeed but not enough.

In order to show the picker you have to set the frame as well, something like this snippet:

if #available(iOS 13.4, *) {

    picker.frame = CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 250.0)
    picker.frame = CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 250.0)
    picker.preferredDatePickerStyle = .wheels
    picker.preferredDatePickerStyle = .wheels
}

Upvotes: 0

Kaushal Bhalara
Kaushal Bhalara

Reputation: 1

fixed this issue. I tried below code.

Hope so it will helpful for you. Best of Luck !!!

        datePicker.datePickerMode = UIDatePicker.Mode.date
        let gregorian: NSCalendar = NSCalendar(calendarIdentifier: NSCalendar.Identifier.gregorian)!
        let currentDate: NSDate = NSDate()
        let components: NSDateComponents = NSDateComponents()
        
        components.year =  -1
        let minDate: NSDate = gregorian.date(byAdding: components as DateComponents, to: currentDate as Date, options: NSCalendar.Options(rawValue: 0))! as NSDate
        
        datePicker.minimumDate = minDate as Date
        if #available(iOS 13.4, *) {
            datePicker.frame = CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 72.0)
            
        } else {
            // Fallback on earlier versions
        }
        dateField.inputView = datePicker
        
        let toolbar = UIToolbar();
        toolbar.sizeToFit()
        
        //done button & cancel button
        let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItem.Style.done, target: self, action: #selector(ReservationTableViewController.doneDatePicker))
        let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: nil, action: nil)
        let cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItem.Style.plain, target: self, action: #selector(ReservationTableViewController.cancelDatePicker))
        
        toolbar.setItems([doneButton,spaceButton,cancelButton], animated: false)
        
        
        // add toolbar to textField
        self.dateField.inputAccessoryView = toolbar
        
        datePicker.addTarget(self, action: #selector(ReservationTableViewController.datePickerValueChanged), for: UIControl.Event.valueChanged)

Upvotes: -1

Related Questions