How to add a "Done" button with in the DatePicker Through StoryBoard?

Question

In my app i want to display UIDatePicker when user click on button.and that date save into UITextFiled.I done this things. My problem is when date picker appears there is no done button,How can add that done button. Upto now i tried.

- (IBAction)pickerAction:(id)sender
{
datePicker.datePickerMode=UIDatePickerModeDate;
datePicker.hidden=NO;
datePicker.date=[NSDate date];
[datePicker addTarget:self action:@selector(TextTitle:) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:datePicker];
NSDateFormatter * df = [[NSDateFormatter alloc] init];
[df setDateFormat:@"M-d-yyyy"];
selectedDate.text=[df stringFromDate:datePicker.date];
} 

-(void)TextTitle:(id)sender
{
NSDateFormatter *df = [[NSDateFormatter alloc] init];
[df setDateFormat:@"M-d-yyyy"];
selectedDate.text = [NSString stringWithFormat:@"%@",
                      [df stringFromDate:datePicker.date]];
 }

How can i add done button with this code. please help me.

This isn't through a storyboard but the highest voted answer here is very easy using an accessory view http://stackoverflow.com/questions/13700552/toolbar-at-the-top-of-uipickerview-in-xcode — DogCoffee, Mar 19 '16 at 10:40

score 12 · Accepted Answer · edited Mar 31 '16 at 13:24

12

Answer is

datePicker=[[UIDatePicker alloc]init];
datePicker.datePickerMode=UIDatePickerModeDate;
[TextField1 setInputView:datePicker];

UIToolbar *toolBar=[[UIToolbar alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 44)];
[toolBar setTintColor:[UIColor grayColor]];
UIBarButtonItem *doneBtn=[[UIBarButtonItem alloc]initWithTitle:@"Done" style:UIBarButtonItemStyleBordered target:self action:@selector(ShowSelectedDate)];
UIBarButtonItem *space=[[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[toolBar setItems:[NSArray arrayWithObjects:space,doneBtn, nil]];

[TextField1 setInputAccessoryView:toolBar];

edited Mar 31 '16 at 13:24

Majid Bashir

558
1
4
27

answered Mar 30 '16 at 11:03

User558

1,165
1
13
37

1

Might be a good idea to show how to dismiss the Date Picker. How about, TextField1.resignFirstResponder? I noticed below, how folk have created elaborate routines for animating the picker off the view. But the resignFirstResponder will do that for you, assuming the TextField1 has its inputView set to the picker, as in this example. – Carl Hine Sep 27 '16 at 10:21

score 2 · Answer 2 · answered Mar 19 '16 at 07:31

I added a UIToolbar with a UIBarButtonItem for the 'done' button in my xib with the frame set so that it's not initially visible (y value equal to the height of the parent view).

Every time the user access the picker, I changed the frame (the y value) of the UIDatePicker and the UIToolbar with an animation so that it slides up along with the picker from the bottom of the screen similar to the keyboard.

Check out my code below.

- (IBAction)showPicker
{
    if(pickerVisible == NO)
    {
        // create the picker and add it to the view
        if(self.datePicker == nil) self.datePicker = [[[UIDatePicker alloc] initWithFrame:CGRectMake(0, 460, 320, 216)] autorelease];
        [self.datePicker setMaximumDate:[NSDate date]];
        [self.datePicker setDatePickerMode:UIDatePickerModeDate];
        [self.datePicker setHidden:NO];
        [self.view addSubview:datePicker];

        // the UIToolbar is referenced 'using self.datePickerToolbar'
        [UIView beginAnimations:@"showDatepicker" context:nil];
        // animate for 0.3 secs.
        [UIView setAnimationDuration:0.3];

        CGRect datepickerToolbarFrame = self.datePickerToolbar.frame;
        datepickerToolbarFrame.origin.y -= (self.datePicker.frame.size.height + self.datePickerToolbar.frame.size.height);
        self.datePickerToolbar.frame = datepickerToolbarFrame;

        CGRect datepickerFrame = self.datePicker.frame;
        datepickerFrame.origin.y -= (self.datePicker.frame.size.height + self.datePickerToolbar.frame.size.height);
        self.datePicker.frame = datepickerFrame;

        [UIView commitAnimations];
        pickerVisible = YES;
    }
}

- (IBAction)done
{
    if(pickerVisible == YES)
    {
        [UIView beginAnimations:@"hideDatepicker" context:nil];
        [UIView setAnimationDuration:0.3];

        CGRect datepickerToolbarFrame = self.datePickerToolbar.frame;
        datepickerToolbarFrame.origin.y += (self.datePicker.frame.size.height + self.datePickerToolbar.frame.size.height);
        self.datePickerToolbar.frame = datepickerToolbarFrame;

        CGRect datepickerFrame = self.datePicker.frame;
        datepickerFrame.origin.y += (self.datePicker.frame.size.height + self.datePickerToolbar.frame.size.height);
        self.datePicker.frame = datepickerFrame;
        [UIView commitAnimations];

        // remove the picker after the animation is finished
        [self.datePicker performSelector:@selector(removeFromSuperview) withObject:nil afterDelay:0.3];
    }
}

score 2 · Answer 3 · answered Mar 30 '16 at 11:20

2

Check this library. It is very easy to implement.

https://github.com/hackiftekhar/IQActionSheetPickerView

answered Mar 30 '16 at 11:20

Raj Tandel

359
2
12

score 2 · Answer 4 · answered Apr 05 '16 at 11:46

2

go to the link below.

http://www.iostute.com/2015/01/create-and-use-date-picker-uidatepicker.html

i think it'll help you.

answered Apr 05 '16 at 11:46

Soorej Babu

350
2
19

it is a tutorial in UIDatePicker – Soorej Babu Apr 05 '16 at 11:47

score 1 · Answer 5 · answered Mar 19 '16 at 09:33

1

You can use UIView and in this UIView add your Datepicker and Done button. Done button create Action event and in this you will handle your UIView hide and show. Hope this helps

answered Mar 19 '16 at 09:33

Kamlesh Shingarakhiya

2,757
2
16
34

How to add a "Done" button with in the DatePicker Through StoryBoard?

5 Answers5