iPhone datepicker instead of keyboard?

Question

How would you do that?

I have a form with a UITextField. When I click in it I would like to display a UIDatePicker instead of the default Keyboard that pops-up by default? Note that there are also other elements on my form.

Solution 1

I think this is a more official way to do this:

UIDatePicker *datePicker = [[[UIDatePicker alloc] init] autorelease];
datePicker.datePickerMode = UIDatePickerModeDate;
[datePicker addTarget:self action:@selector(datePickerValueChanged:) forControlEvents:UIControlEventValueChanged];
datePicker.tag = indexPath.row;
textField.inputView = datePicker;

Solution 2

in .h

UIDatePicker *datePicker;
NSDate *date;
UIToolbar *keyboardToolbar;

in ViewDidLoad:

if (keyboardToolbar == nil) {
    keyboardToolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, 44)];
    [keyboardToolbar setBarStyle:UIBarStyleBlackTranslucent];

    UIBarButtonItem *extraSpace = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];

    UIBarButtonItem *accept = [[UIBarButtonItem alloc] initWithTitle:@"Accept" style:UIBarButtonItemStyleDone target:self action:@selector(closeKeyboard:)];

    [keyboardToolbar setItems:[[NSArray alloc] initWithObjects: extraSpace, accept, nil]];
}

self.txtDate.inputAccessoryView = keyboardToolbar;

datePicker = [[UIDatePicker alloc] init];
datePicker.datePickerMode = UIDatePickerModeDate;
[datePicker addTarget:self action:@selector(datePickerValueChanged:) forControlEvents:UIControlEventValueChanged];

self.txtDate.inputView = datePicker;


- (void)datePickerValueChanged:(id)sender{

date = datePicker.date;

NSDateFormatter *df = [[NSDateFormatter alloc] init];
[df setDateFormat:@"dd/MM/YYYY"];


[self.txtDate setText:[df stringFromDate:date]];
}

in storyboard add to txtDate -> EditingDidEnd

- (IBAction)establishHour:(id)sender{

hour = hourPicker.date;

NSDateFormatter *hf = [[NSDateFormatter alloc] init];
[hf setDateFormat:@"HH:MM"];

[self.txtHour setText:[hf stringFromDate:hour]];

}

Sets the keyboard as DatePicker and created a toolbar with a button to accept the selection.

Solution 3

I've converted Johan Kool's answer into swift if anyone would like it. I placed the code in viewDidLoad.

let datePicker = UIDatePicker()
datePicker.datePickerMode = UIDatePickerMode.Date
datePicker.addTarget(self, action: "datePickerValueChanged:", forControlEvents: UIControlEvents.ValueChanged)
textField.inputView = datePicker

Comments

[Oscar]

This is not working for me in iOS 5. The text field still presents the normal keyboard when clicked. After setting textField.inputView with a valid pointer and then examining it immediately afterward, it's back to nil. Anybody have an idea why? I'm setting it in viewDidLoad.

[NSExplorer]

check and see if your "datePicker" ivar is not nil

[Mick MacCallum]

To improve the quality of your post, please include how/why this code will solve the problem.

[Luca Rocchi]

- (void)cerrarTeclado:(id)sender{ [self.txtFecha resignFirstResponder]; }

[Noor]

this is working perfectly fine, but how to hide the date picker after the date has been selected

[ocross]

@Noor you would just resign the textfield as first responder. eg. [textField resignFirstResponder];

[shashwat]

How would you know that the user has selected the date he wants..? Because there is no OK/DONE button.

[Johan Kool]

@shashwat You could add a toolbar with a done button as a inputAccessoryView. Or simply consider the selecting of another field as indication that the user wants to use the selected date.

[DesignatedNerd]

Please use the built-in UIDatePicker instead of trying to roll your own - it will save you a lot of time and pain.

[Vladimir Grigorov]

Add one more line for iOS 14 and above: datePicker.preferredDatePickerStyle = .wheels