How can I show a UIDatePicker instead of a keyboard when a user selects a UITextField?

Question

I have a nice clean UI within a table view which has a few text fields for the user to fill out. One of the fields is for the user's birthday.

I'd like to have it so that when the user selects the birthday field, a view containing a UIDatePicker would come up as, just like the different keyboards do when selecting a text field.

Can this be done? I would have to prevent the text field from being the first responder (to avoid having the keyboard come up) and I would have to animate the view sliding up if no keyboard was showing before.

Would presenting the view modally be an option? If so how would I go about doing it? From the documentation it seems that modal views still take up the whole screen, I just want to use the lower 216 pixels (height of the keyboard and UIDatePicker).

Any one have any tips on how to go about doing this?

score 33 · Answer 1 · edited Sep 08 '13 at 17:17

33

Old question but the correct way to do this these days would be to set the UITextField's inputView to a picker you created somewhere. Something like this:

UIPickerView *myPicker = [[UIPickerView alloc] init];
// set picker frame, options, etc...
// N.B. origin for the picker's frame should be 0,0

[myTextField setInputView:myPicker];

When you go to edit a UITextField, iOS really just displays whatever view is at textField.inputView which by default is the keyboard, you can make it anything you want as long as it's a subclass of UIView.

edited Sep 08 '13 at 17:17

zero7

1,298
8
14

answered Jan 08 '13 at 23:43

Endophage

21,038
13
59
90

3

This answer should be accepted instead of the "UIView animation" solution. Thanks – klefevre Jun 11 '14 at 16:13

score 7 · Answer 2 · edited May 23 '17 at 12:03

Regarding animation, take a look at DateCell sample application - http://developer.apple.com/library/ios/#samplecode/DateCell/Introduction/Intro.html

And in any case, the proper way to do this is set UITextField's inputView to show the picker instead of the keyboard. That's what it's meant to do. More on that here: How can I present a picker view just like the keyboard does?

Cheers,

Oded.

score 5 · Accepted Answer · answered Dec 08 '09 at 21:44

5

I would implement this by just animating a view containing the UIDatePicker, a Done, and Cancel button) up from the bottom of the screen. Using CoreAnimation, this should be pretty easy.

answered Dec 08 '09 at 21:44

Ben Gottlieb

85,404
22
176
172

How would I go about doing this? I have a view controller/view designed in IB, but I don't know what to do next. Do I add the view as a subview to the currently displayed view and then animate it somehow? I'm not sure how UIViews relate to CALayers for animation. – Ben S Dec 09 '09 at 16:41
1

Nevermind. I was able to figure it out. I add the view that contains the date picker to the window and animated it using a `[UIView beginAnimations]` block – Ben S Dec 09 '09 at 18:34
Guys, see Oded Bex Dov's solution just below. As long as you're coding for iOS 3.2 or higher, you can have the framework animate and manage the pickers for you along with the keyboard. Definitely the correct way of doing it. – Craig B Nov 15 '11 at 03:19

score 1 · Answer 4 · answered Dec 08 '09 at 21:46

Why are you using a text field if you don't want to accept user input from a keyboard? Instead use a UILabel subclass (where you override the touchesBegan/Ended:withEvent: set of methods to show the UIDatePicker) or a UIButton (where your action is a method which slides up the UIDatePicker).

How can I show a UIDatePicker instead of a keyboard when a user selects a UITextField?

4 Answers4

Linked