Fitting a UIDatePicker into a UIActionSheet

Question

I'm trying to get a UIDatePicker with a UIButton to show up in a UIActionSheet. Unfortunately it gets cropped off and the entire Date Picker is not visible. I have not even attempted to add the UIButton yet. Can anyone suggest on getting the entire view to fit properly? I'm not sure how to add the proper dimensions as UIActionSheet seems to lack an -initWithFrame: type constructor.

UIActionSheet *menu = [[UIActionSheet alloc] initWithTitle:@"Date Picker" 
                                                  delegate:self
                                         cancelButtonTitle:@"Cancel"
                                    destructiveButtonTitle:nil
                                         otherButtonTitles:nil];

// Add the picker
UIDatePicker *pickerView = [[UIDatePicker alloc] init];
pickerView.datePickerMode = UIDatePickerModeDate;
[menu addSubview:pickerView];
[menu showInView:self.view];

[pickerView release];
[menu release];

I've also tried with something similar to:

UIActionSheet *menu = [[UIActionSheet alloc] initWithFrame:CGRectMake(200.0, 200.0, 100.0f, 100.0f)];

The coords are ofcourse not realistic, but they don't seem to affect the position/size of the UIActionSheet.

Solution 1

You can use something like this (adjust the coordinates):

    UIActionSheet *menu = [[UIActionSheet alloc] initWithTitle:@"Date Picker" 
                                                  delegate:self
                                         cancelButtonTitle:@"Cancel"
                                    destructiveButtonTitle:nil
                                         otherButtonTitles:nil];

    // Add the picker
    UIDatePicker *pickerView = [[UIDatePicker alloc] init];
    pickerView.datePickerMode = UIDatePickerModeDate;
    [menu addSubview:pickerView];
    [menu showInView:self.view];    
    [menu setBounds:CGRectMake(0,0,320, 500)];

    CGRect pickerRect = pickerView.bounds;
    pickerRect.origin.y = -100;
    pickerView.bounds = pickerRect;

    [pickerView release];
    [menu release];

But you better create a fullscreen view with a UIDatePicker and a navigation bar. For an example see UICatalog -> Pickers sample from the iPhone DevCenter.

Solution 2

Try adding following line to resolve disabled buttons issue

[menu sendSubviewToBack:pickerView];

Solution 3

Dmitry's answer is almost correct. However, the frame of the actionsheet is too small, and therefore touches near the bottom of the picker are ignored. I have corrected these problems:

UIActionSheet *menu = [[UIActionSheet alloc] initWithTitle:@"Date Picker" 
                                                  delegate:self
                                         cancelButtonTitle:@"Cancel"
                                    destructiveButtonTitle:nil
                                         otherButtonTitles:@"OK",nil];    
// Add the picker
UIDatePicker *pickerView = [[UIDatePicker alloc] init];
pickerView.datePickerMode = UIDatePickerModeTime;
[menu addSubview:pickerView];
[menu showInView:_mainView];        

CGRect menuRect = menu.frame;
CGFloat orgHeight = menuRect.size.height;
menuRect.origin.y -= 214; //height of picker
menuRect.size.height = orgHeight+214;
menu.frame = menuRect;


CGRect pickerRect = pickerView.frame;
pickerRect.origin.y = orgHeight;
pickerView.frame = pickerRect;

[pickerView release];
[menu release];  

Solution 4

This works for me

NSString *title = UIDeviceOrientationIsLandscape([UIDevice currentDevice].orientation) ? @"\n\n\n\n\n\n\n\n\n" : @"\n\n\n\n\n\n\n\n\n\n\n\n" ;
UIActionSheet *actionSheet = [[UIActionSheet alloc] 
                              initWithTitle:[NSString stringWithFormat:@"%@%@", title, NSLocalizedString(@"SelectADateKey", @"")]
                              delegate:self cancelButtonTitle:nil destructiveButtonTitle:nil otherButtonTitles:@"Ok", nil];
[actionSheet showInView:self.view];
UIDatePicker *datePicker = [[[UIDatePicker alloc] init] autorelease];
datePicker.datePickerMode = UIDatePickerModeDate;
[actionSheet addSubview:datePicker];

a little tricky but it works!

Solution 5

Buttons at top, picker at bottom:

 UIActionSheet *menu = [[UIActionSheet alloc] initWithTitle:@"Date Picker" 
                                                  delegate:self
                                         cancelButtonTitle:@"Cancel"
                                    destructiveButtonTitle:nil
                                         otherButtonTitles:@"OK",nil];    
// Add the picker
UIDatePicker *pickerView = [[UIDatePicker alloc] init];
pickerView.datePickerMode = UIDatePickerModeTime;
[menu addSubview:pickerView];
[menu showInView:_mainView];        

CGRect menuRect = menu.frame;
menuRect.origin.y -= 214;
menuRect.size.height = 300;
menu.frame = menuRect;


CGRect pickerRect = pickerView.frame;
pickerRect.origin.y = 174;
pickerView.frame = pickerRect;

[pickerView release];
[menu release];  

View more solutions

Comments

[Ankit Sharma]

I tried this approach, it looked fine, but I found that the buttons on the UIActionSheet were disabled. Any ideas?

[death_au]

This still doesn't work for me. I suspect part of my problem is that I have a tab bar in my application. If I shift the menu.frame another 44 pixels (the height of the tab bar) the date picker works flawlessly, but there's a 44 pixel gap at the bottom of the menu.

[Jakob Egger]

Which view are you showing the ActionSheet in, ie. what is your _mainView? Don't show the ActionSheet in your content view, show it in the view containing the content view and the tab bar. If you use a navigation controller, you might do something like [menu showInView:self.navigationController.view].

[Claus]

I was experiencing a not responding zone at the bottom of the screen but Placing [menu sendSubviewToBack:pickerView]; at the very end fixes everything,at least for me on iOS5

[katzenhut]

adding linebreaks in your title is just hacky, but whatever floats your boat, i guess

[Envil]

This answer is awesome!

[masty]

Should be [actionSheet showFromTabBar:self.parentViewController.tabBarController.ta‌​bBar]