iOS Swift 3 - UIDatePicker

Question

I have a UIDatePicker that shows the day, month and the year. But I don't know how to get those parameters.

So What is the best way to get the day, month and year from UIDatePicker using Swift 3?

What kind of date picker you want , I mean to say that whether you want to embed date picker into your textfield or you just want to use as popover on the screen — Ajay Singh Mehra, Nov 08 '16 at 11:12

Enamul Haque · Answer 1 · 2019-12-29T03:44:40.427

UIDatePicker in Swift 3 and Swift 4 example.

In Swift 3 You can use

Create Simple Project of Single View Application in swift 3
Drag a text field & connect to viewController
Date picker look like image

ViewController code is bellow..

  class ViewController: UIViewController {
     //Text Field Connection
   @IBOutlet weak var txtDatePicker: UITextField!
   //Uidate picker
   let datePicker = UIDatePicker()

    override func viewDidLoad() {
    super.viewDidLoad()
   //show date picker
     showDatePicker()
  }


   func showDatePicker(){
   //Formate Date
    datePicker.datePickerMode = .date

    //ToolBar
   let toolbar = UIToolbar();
   toolbar.sizeToFit()

   //done button & cancel button
    let doneButton = UIBarButtonItem(title: "Done", style: UIBarButtonItemStyle.bordered, target: self, action: "donedatePicker")
    let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)
   let cancelButton = UIBarButtonItem(title: "Cancel", style: UIBarButtonItemStyle.bordered, target: self, action: "cancelDatePicker")
   toolbar.setItems([doneButton,spaceButton,cancelButton], animated: false)

// add toolbar to textField
txtDatePicker.inputAccessoryView = toolbar
 // add datepicker to textField
txtDatePicker.inputView = datePicker

   }

 func donedatePicker(){
  //For date formate
   let formatter = DateFormatter()
   formatter.dateFormat = "dd/MM/yyyy"
   txtDatePicker.text = formatter.string(from: datePicker.date)
   //dismiss date picker dialog
   self.view.endEditing(true)
    }

      func cancelDatePicker(){
       //cancel button dismiss datepicker dialog
        self.view.endEditing(true)
      }
   }

Full Source project is given to github. github Link:https://github.com/enamul95/DatePicker1

In Swift 4 or 5 you can use bellow code

 class ViewController: UIViewController {

   @IBOutlet weak var txtDatePicker: UITextField!
  let datePicker = UIDatePicker()

  override func viewDidLoad() {
    super.viewDidLoad()
     showDatePicker()
  }


  func showDatePicker(){
    //Formate Date
    datePicker.datePickerMode = .date

   //ToolBar
   let toolbar = UIToolbar();
   toolbar.sizeToFit()
   let doneButton = UIBarButtonItem(title: "Done", style: .plain, target: self, action: #selector(donedatePicker));
   let spaceButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.flexibleSpace, target: nil, action: nil)
  let cancelButton = UIBarButtonItem(title: "Cancel", style: .plain, target: self, action: #selector(cancelDatePicker));

 toolbar.setItems([doneButton,spaceButton,cancelButton], animated: false)

  txtDatePicker.inputAccessoryView = toolbar
  txtDatePicker.inputView = datePicker

 }

  @objc func donedatePicker(){

   let formatter = DateFormatter()
   formatter.dateFormat = "dd/MM/yyyy"
   txtDatePicker.text = formatter.string(from: datePicker.date)
   self.view.endEditing(true)
 }

 @objc func cancelDatePicker(){
    self.view.endEditing(true)
  }
}

You can also use localized done and cancel bar buttons as follows (Swift 4, don't know in 3): let doneButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.done, target: self, action: #selector(donedatePicker)) let cancelButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonSystemItem.cancel, target: self, action: #selector(cancelDatePicker)) — Albert Llorens Mestre, Sep 14 '18 at 19:08

Nirav D · Accepted Answer · 2018-06-02T02:58:45.160

57

In Swift 3 you can use DateComponents for that like this way.

First add action on datepicker for .valueChanged events.

datepicker.addTarget(self, action: #selector(dateChanged(_:)), for: .valueChanged)

Then get selected day, month and year using DateComponents in the action.

func dateChanged(_ sender: UIDatePicker) {
    let components = Calendar.current.dateComponents([.year, .month, .day], from: sender.date)
    if let day = components.day, let month = components.month, let year = components.year {
        print("\(day) \(month) \(year)")
    }
}

edited Jun 02 '18 at 02:58

answered Nov 08 '16 at 10:39

Nirav D

65,660
11
144
172

I didn't notice and made the mistake of registering my action with the `touchUpInside` event. Yet I should do it for `.valueChanged` – Honey Sep 05 '18 at 03:46

score 15 · Answer 3 · answered Nov 08 '16 at 10:27

Suppose if you want to show datePicker on tapping textfield and when user select some date from it then it will automatically populate on your textfield .

 @IBOutlet weak var dateTextField: UITextField!
let datePickerView:UIDatePicker = UIDatePicker()
        datePickerView.datePickerMode = UIDatePickerMode.date
        dateTextField.inputView = datePickerView
        datePickerView.addTarget(self, action: #selector(ViewController.datePickerValueChanged), for: UIControlEvents.valueChanged)

// Make a dateFormatter in which format you would like to display the selected date in the textfield.
func datePickerValueChanged(sender:UIDatePicker) {

        let dateFormatter = DateFormatter()

        dateFormatter.dateStyle = DateFormatter.Style.medium

        dateFormatter.timeStyle = DateFormatter.Style.none

        dateTextField.text = dateFormatter.string(from: sender.date)

    }

Here Sender.date which is the instance of UIDatePicker pick up the date from the datepicker and populate on your textfield.

I didn't know about inputView... So much time won. Thanks! – Skoua Apr 18 '19 at 12:00 — Skoua, Apr 18 '19 at 12:00

vaibhav · Answer 4 · 2016-11-08T13:33:18.300

5

Create IBOutlet of UIDatePicker and connect it properly then use below code to get day, month, year ect.

var comp = NSDateComponents()
@IBOutlet weak var datePicker: UIDatePicker!

override func viewDidLoad() {
    super.viewDidLoad()
    datePicker.addTarget(self, action: Selector("datePickerChanged:"), forControlEvents: UIControlEvents.ValueChanged)
}

func datePickerChanged(datePicker:UIDatePicker){
    let dateFormatter = NSDateFormatter()
    dateFormatter.dateStyle = NSDateFormatterStyle.ShortStyle
    dateFormatter.timeStyle = NSDateFormatterStyle.ShortStyle
    let cal = NSCalendar.currentCalendar()
    comp = cal.components([.Era, .Day, .Month, .Year, .Hour, .Minute] , fromDate: datePicker.date)

    // getting day, month, year ect
    print ("Era:\(comp.era) Date:\(comp.day) Month:\(comp.month) Month:\(comp.year) Hours: \(comp.hour) Minuts:\(comp.minute)")
}

edited Nov 08 '16 at 13:33

answered Nov 08 '16 at 10:26

vaibhav

3,893
1
19
46

OP has asked in Swift 3, So batter to use `DateComponents` instead of `NSDateComponents` and `Calendar` instead of `NSCalendar`. – Nirav D Nov 08 '16 at 10:43
1

@NiravD it's a version diff, anyway appreciating your contribution here +one for you also :) – vaibhav Nov 08 '16 at 10:47
@vaibhav not calling `super` from `viewDidLoad` is a serious error. – dirtydanee Nov 08 '16 at 13:31
@dirtydanee that was formatting issue just rectified, `super` was already there. – vaibhav Nov 08 '16 at 13:37

score 3 · Answer 5 · edited Jul 07 '17 at 22:59

var picker = UIDatePicker()
picker = UIDatePicker()
textField.inputView = picker
picker.addTarget(self, action: #selector(ViewController.handleDatePicker), for: UIControlEvents.valueChanged)
picker.datePickerMode = .date

func handleDatePicker() {
    var dateFormatter = DateFormatter()
    dateFormatter.dateFormat = "dd-MM-yyyy"
    textfield.text = dateFormatter.string(from: picker.date)
    textfield.resignFirstResponder()
}

score 2 · Answer 6 · answered Nov 08 '16 at 10:28

The problem can be solved in numerous way. If you are looking for a solution only using code:

    class Foo: UIViewController {
        // Lets create your picker - Can be IBOutlet too
        lazy var datePicker: UIDatePicker = {
            let picker = UIDatePicker()
            picker.datePickerMode = .date
            return picker
        }()

    override func viewDidLoad() {
        super.viewDidLoad()
        //Observe the value changes in datePickerValueChanged function for example
        datePicker.addTarget(self, action: #selector(datePickerValueChanged), for: .valueChanged)
    }

    func datePickerValueChanged(sender: UIDatePicker) {
        // Function will be called every time picker changes it's value
        // You can access to it the following way
        print(sender.date)
    }
  }

The other way if you have your UIDatePicker in Interface Builder. You pretty much need to the same thing, like above, but i a slightly different way. Click on your UIDatePicker in Interface Builder:

You see the Value Changed option at the buttom. Now you grab and drag an IBAction to your viewController, and set up your connection like this:

This way you achive the same as the first example, because you end up with pretty much the same function:

@IBAction func datePickerValueChanged(sender: UIDatePicker) {
    print(sender.date)
}

score 1 · Answer 7 · answered Aug 19 '20 at 15:51

Swift 5 users can try this it works for me

import UIKit

class FreeCallsViewController: UIViewController {

@IBOutlet weak var dateTextField: UITextField!

let datepicker = UIDatePicker()

override func viewDidLoad() {
    super.viewDidLoad()

    // Do any additional setup after loading the view.
}

@IBAction func calenderButtonPressed(_ sender: UIButton) {
    self.createDatePicker()
}

func createDatePicker() {
    let toolbar = UIToolbar()
    toolbar.sizeToFit()
    
    let donebtn = UIBarButtonItem(barButtonSystemItem: .done, target: nil, action: #selector(donepressed))
    
    toolbar.setItems([donebtn], animated: true)
    
    dateTextField.inputAccessoryView = toolbar
    
    dateTextField.inputView = datepicker
    
    datepicker.datePickerMode = .date
}
@objc func donepressed() {
    let dateformator = DateFormatter()
    
    dateformator.dateStyle = .medium
    dateformator.timeStyle = .none
    
    
    
    dateTextField.text = dateformator.string(from: datepicker.date)
    self.view.endEditing(true)
}

}

score 1 · Answer 8 · edited Feb 04 '21 at 08:23

Swift 5.0+

I hope it will work for you, Enjoy!

import UIKit

protocol SKUIDatePickerDelegate:class {
    func getDate(_ sKUIDatePicker:SKUIDatePicker, date:String)
    func cancel(_ sKUIDatePicker:SKUIDatePicker)
}

class SKUIDatePicker:UIView {
    
    private let datePicker = UIDatePicker()
    private var dateFormate = "yyyy/mm/dd"
    weak var delegate:SKUIDatePickerDelegate?
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        // self.frame = UIScreen.main.bounds
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    func showDatePicker(txtDatePicker:UITextField){
        //Formate Date
        datePicker.datePickerMode = .date
        
        //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)
        
        txtDatePicker.inputAccessoryView = toolbar
        txtDatePicker.inputView = datePicker
        
    }
    
    @objc func donedatePicker(){
        
        let formatter = DateFormatter()
        formatter.dateFormat = dateFormate
        let result = formatter.string(from: datePicker.date)
        self.delegate?.getDate(self, date: result)
        
    }
    
    @objc func cancelDatePicker(){
        self.delegate?.cancel(self)
    }
    
}

Usage

class ViewController: UIViewController,SKUIDatePickerDelegate {
    //Text Field Connection
    @IBOutlet weak var txtDatePicker: UITextField!
    
    private var skUIdatePicker:SKUIdatePicker?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        skUIdatePicker = SKUIdatePicker()
        skUIdatePicker.delegate = self
        skUIdatePicker.showDatePicker(txtDatePicker:txtDatePicker)
    }
    
    func getDate(_ sKUIDatePicker:SKUIDatePicker, date:String) {
        print(date)
        self.view.endEditing(true)
    }
    func cancel(_ sKUIDatePicker:SKUIDatePicker){
        self.view.endEditing(true)
    }
}

iOS Swift 3 - UIDatePicker

8 Answers8