iPhone display date picker on UITextField touch
You could use the UITextField
input view property. Just alloc init a regular UIDatePicker
in code and assign it to the textfield's inputView. Doing this, the UIPickerView
will be presented instead of the keyboard. If you need any code feel free to ask :)
EDIT: code
You fist hook up your textField
with IB
@interface myViewController <UITextFieldDelegate>
@property (nonatomic,weak) IBOutlet UITextField *myTextField;
@end
In the implementation
UIDatePicker *datePicker = [[UIDatePicker alloc]init];
[datePicker setDate:[NSDate date]];
[datePicker addTarget:self action:@selector(updateTextField:) forControlEvents:UIControlEventValueChanged];
if (@available(iOS 13.4, *)) {
[datePicker setPreferredDatePickerStyle:UIDatePickerStyleWheels];
}
[self.myTextField setInputView:datePicker];
That will bring up a UIDatePicker
when you tap on the textField
. Note the action that I added to the datePicker.
[datePicker addTarget:self action:@selector(updateTextField:) forControlEvents:UIControlEventValueChanged];
To update the textField each time that the user scrolls in the picker, you just need to implement the updateTextField
method somewhere in the viewController
-(void)updateTextField:(id)sender
{
UIDatePicker *picker = (UIDatePicker*)self.myTextField.inputView;
self.myTextField.text = [NSString stringWithFormat:@"%@",picker.date];
}
With this last method, every time the user rotates the picker, the textfield will update!
- You could use a
NSDateFormatter
to improve the output of the string.
Here's what I did in Swift 4:
let datePicker = UIDatePicker()
@IBOutlet weak var myTextField: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
setDatePicker()
}
func setDatePicker() {
//Format 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)
myTextField.inputAccessoryView = toolbar
myTextField.inputView = datePicker
}
@objc func doneDatePicker(){
let formatter = DateFormatter()
formatter.dateFormat = "MM/dd/yyyy"
myTextField.text = formatter.string(from: datePicker.date)
self.view.endEditing(true)
}
@objc func cancelDatePicker(){
self.view.endEditing(true)
}
Below is how I am displaying the date picker.
- (void)textFieldDidBeginEditing:(UITextField *)textField
{
self.activeTextField = textField;
// Create a date picker for the date field.
UIDatePicker *datePicker = [[UIDatePicker alloc]init];
datePicker.datePickerMode = UIDatePickerModeDate;
datePicker.minimumDate = [NSDate dateWithTimeIntervalSinceNow:-31536000];
[datePicker setDate:[NSDate date]];
[datePicker addTarget:self action:@selector(updateDateField:) forControlEvents:UIControlEventValueChanged];
// If the date field has focus, display a date picker instead of keyboard.
// Set the text to the date currently displayed by the picker.
if (textField.tag == 1)
{
self.date.inputView = datePicker;
self.date.text = [self formatDate:datePicker.date];
}
}
// Called when the date picker changes.
- (void)updateDateField:(id)sender
{
UIDatePicker *picker = (UIDatePicker*)self.date.inputView;
self.date.text = [self formatDate:picker.date];
}
// Formats the date chosen with the date picker.
- (NSString *)formatDate:(NSDate *)date
{
NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
[dateFormatter setDateStyle:NSDateFormatterShortStyle];
[dateFormatter setDateFormat:@"MM'/'dd'/'yyyy"];
NSString *formattedDate = [dateFormatter stringFromDate:date];
return formattedDate;
}