Replace iOS7 keyboard with date picker in TableViewController

Question

I would like my DateText text box to open a DatePicker (Year - Month - Day) with this value type:

YYYY-MM-DD 

Is there an easy way to change the keyboard?

Answer 1

You can "replace" the keyboard using the inputView UITextField property:

 - (void) initializeTextFieldInputView { UIDatePicker *datePicker = [[UIDatePicker alloc] initWithFrame:CGRectZero]; datePicker.datePickerMode = UIDatePickerModeDate; [datePicker addTarget:self action:@selector(dateUpdated:) forControlEvents:UIControlEventValueChanged]; self.textField.inputView = datePicker; } - (void) dateUpdated:(UIDatePicker *)datePicker { NSDateFormatter *formatter = [[NSDateFormatter alloc] init]; [formatter setDateFormat:@"yyyy-MM-dd"]; self.textField.text = [formatter stringFromDate:datePicker.date]; } 

UIDatePickers does not have a delegate like UIPickerViews, so you need to add an action as if it were a UIButton. : At the end of the declaration, the selector provides the UIDatePicker as a convenience for getting the date it was changed. If you do not want to send the object in the method, you can get the UIDatePicker by specifying the input file UITextField:

 UIDatePicker *datePicker = (UIDatePicker *)self.textField.inputView; 

Finally, when setting up formats using NSDateFormatter, it is recommended that you use one method to return an NSDateFormatter object to ensure that the format is consistent. At the very least, create a constant / macro once in your project that declares a format string.

EDIT

As Pavan asked in the comments, if you want to add a "done" button above the keyboard, use inputAccessoryView:

 UIToolbar *toolbar = [[UIToolbar alloc] init]; UIBarButtonItem *doneButton = [[UIBarButtonItem alloc] initWithTitle:@"Done" style:UIBarButtonItemStyleDone target:self action:@selector(doneButtonWasPressed:)]; UIBarButtonItem *flexibleSeparator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil]; toolbar.items = @[flexibleSeparator, doneButton]; self.textField.inputAccessoryView = toolbar; 

EDIT 2, SWIFT

This answer seems to be pretty outdated. Adding an implementation using Swift 3:

 @IBOutlet weak var textField: UITextField! override func viewDidLoad() { super.viewDidLoad() self.initializeTextFieldInputView() } func initializeTextFieldInputView() { // Add date picker let datePicker = UIDatePicker() datePicker.datePickerMode = .date datePicker.addTarget(self, action: #selector(dateChanged(_:)), for: .valueChanged) self.textField.inputView = datePicker // Add toolbar with done button on the right let toolbar = UIToolbar(frame: CGRect(x: 0, y: 0, width: self.view.bounds.width, height: 1)) let flexibleSeparator = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil) let doneButton = UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(doneButtonPressed(_:))) toolbar.items = [flexibleSeparator, doneButton] self.textField.inputAccessoryView = toolbar } func dateChanged(_ datePicker: UIDatePicker) { let formatter = DateFormatter() formatter.dateFormat = "yyyy-MM-dd" self.textField.text = formatter.string(from: datePicker.date) } 

You can also get a UIDatePicker by executing an inputView in a UITextField:

 let datePicker = self.textField.inputView as? UIDatePicker 

Answer 2

Swift 2.0

I found that Chris answered above useful, but needed him in Swift.

 override func viewDidLoad() { super.viewDidLoad() // Present UIDatePicker for date input let datePicker = UIDatePicker(frame: CGRectZero) datePicker.datePickerMode = .Date datePicker.addTarget(self, action: #selector(SettingsViewController.DateChanged), forControlEvents: .ValueChanged) self.fromTimeField.inputView = datePicker } func timeChanged(datePicker: UIDatePicker) { let formatter = NSDateFormatter() formatter.dateFormat = "yyyy-MM-dd" self.fromTimeField.text = formatter.stringFromDate(datePicker.date) 

Answer 3

Enable UIDatePicker with editing. Begin the action when creating the TextField action.

 - (IBAction)textFieldAction:(id)sender { // Place your code for UIDatePicker [textField resignFirstResponder]; //add this line in the end. }