Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ios UITextField to edit with uidatepicker

I have a uitextfield where is written a date.. how can I show on the bottom of the page a uidatepicker instead of a standard keyboard? thanks in advance

like image 968
ghiboz Avatar asked Jan 18 '11 22:01

ghiboz


3 Answers

Make sure your class implements the UITextFieldDelegate protocol. Then, override the shouldBeginEditing delegate method to return FALSE:

- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField
{
    //check if it is the UITextField you don't want the keyboard for
    if (textField != dateTextField)
        return TRUE;

    //present your UIDatePicker
    //see instructions below

    //Return false to prevent the keyboard from appearing.
    return FALSE;
}

I recommend using another UIViewController that contains a UIDatePicker and use presentModalViewController to show it. This conforms to the User-Interface Guidelines.

like image 137
Evan Mulawski Avatar answered Nov 15 '22 23:11

Evan Mulawski


UITextField provides a mechanism for this. You're supposed to be able to set another view (like a datepicker) as the inputView. See this post:

iPhone datepicker instead of keyboard?

like image 34
Oscar Avatar answered Nov 15 '22 23:11

Oscar


You can use the following code ;

//first of all, you have to declare the datePicker and then use the following code; 

-(void)textFieldDidBeginEditing:(UITextField *)textField
{
[dateLabel resignFirstResponder]; //the textField that you will set the selected date
datePicker = [[UIDatePicker alloc] init]; //declared uidatepicker component

pickerViewDate = [[UIActionSheet alloc] initWithTitle:@"Select the date!"
                                             delegate:self
                                    cancelButtonTitle:nil
                               destructiveButtonTitle:nil
                                    otherButtonTitles:nil];

datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0.0, 44.0, 0.0, 0.0)];
datePicker.datePickerMode = UIDatePickerModeDate; //set your spesific mode

NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
[dateFormatter setFormatterBehavior:NSDateFormatterBehavior10_4];
[dateFormatter setLocale:[[NSLocale alloc] initWithLocaleIdentifier:@"en_US"]]; //or another LocaleIdentifier instead of en_US
[dateFormatter setDateFormat:@"dd.MM.yyyy"]; //desired format

[datePicker addTarget:self action:@selector(dateChanged) forControlEvents:UIControlEventValueChanged]; //the function would be fired when user change the date in datePicker

//now preparing the toolbar which will be displayed at the top of the datePicker
pickerToolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
pickerToolbar.barStyle=UIBarStyleBlackOpaque;
[pickerToolbar sizeToFit];
NSMutableArray *barItems = [[NSMutableArray alloc] init];
UIBarButtonItem *flexSpace = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(doneButtonClicked)]; //barbutton item is "DONE" and doneButtonClicked action will be fired when user clicks the button.
[barItems addObject:flexSpace]; // set the left of the bar

[pickerToolbar setItems:barItems animated:YES];
[pickerViewDate addSubview:pickerToolbar];
[pickerViewDate addSubview:datePicker];
[pickerViewDate showInView:self.view];
[pickerViewDate setBounds:CGRectMake(0,0,320, 464)]; //you can change the position
}

and additional actions ;

-(IBAction)dateChanged{
    NSDateFormatter *FormatDate = [[NSDateFormatter alloc] init];
    [FormatDate setLocale: [[NSLocale alloc]
                         initWithLocaleIdentifier:@"en_US"]];
    [FormatDate setDateFormat:@"dd.MM.yyyy"];
    dateLabel.text = [FormatDate stringFromDate:[datePicker date]];
}

-(BOOL)closeDatePicker:(id)sender{
    [pickerViewDate dismissWithClickedButtonIndex:0 animated:YES];
    [dateLabel resignFirstResponder];
    return YES;
}

-(IBAction)doneButtonClicked{
    [self closeDatePicker:self];
}
like image 3
Murat Calim Avatar answered Nov 15 '22 22:11

Murat Calim