Search code examples
iosobjective-cuipickerviewuidatepicker

Adjusting Code for Custom UIDatePicker


So i found this amazing code on here that pops up a UIDatePicker. (kudos to Matthias Bauch) I'd like to customize it with a custom picker wheel, but the code is at a complexity level that I'm not sure how to go about switching to a UIPicker and how to fill said picker with my arrays.

Here is the original code:

- (void)changeDate:(UIDatePicker *)sender {
    NSDateFormatter *dateFormat = [[NSDateFormatter alloc] init];
  [dateFormat setDateFormat:@"cccc, MMM d, hh:mm aa"];
  NSString *formattedVersion = [dateFormat stringFromDate:sender.date];
  NSLog(@"%@",formattedVersion);

}

- (void)removeViews:(id)object {
 [[self.view viewWithTag:9] removeFromSuperview];
 [[self.view viewWithTag:10] removeFromSuperview];
 [[self.view viewWithTag:11] removeFromSuperview];
}

- (void)dismissDatePicker:(id)sender {
 CGRect toolbarTargetFrame = CGRectMake(0, self.view.bounds.size.height, 320, 44);
 CGRect datePickerTargetFrame = CGRectMake(0, self.view.bounds.size.height+44, 320, 216);
 [UIView beginAnimations:@"MoveOut" context:nil];
 [self.view viewWithTag:9].alpha = 0;
 [self.view viewWithTag:10].frame = datePickerTargetFrame;
 [self.view viewWithTag:11].frame = toolbarTargetFrame;
 [UIView setAnimationDelegate:self];
 [UIView setAnimationDidStopSelector:@selector(removeViews:)];
 [UIView commitAnimations];
}

- (IBAction)callDP:(id)sender {
 if ([self.view viewWithTag:9]) {
  return;
 }
 CGRect toolbarTargetFrame = CGRectMake(0, self.view.bounds.size.height-216-44, 320, 44);
 CGRect datePickerTargetFrame = CGRectMake(0, self.view.bounds.size.height-216, 320, 216);

 UIView *darkView = [[[UIView alloc] initWithFrame:self.view.bounds] autorelease];
 darkView.alpha = 0;
 darkView.backgroundColor = [UIColor blackColor];
 darkView.tag = 9;
 UITapGestureRecognizer *tapGesture = [[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(dismissDatePicker:)] autorelease];
 [darkView addGestureRecognizer:tapGesture];
 [self.view addSubview:darkView];

 UIDatePicker *datePicker = [[[UIDatePicker alloc] initWithFrame:CGRectMake(0, self.view.bounds.size.height+44, 320, 216)] autorelease];
 datePicker.tag = 10;
 [datePicker addTarget:self action:@selector(changeDate:) forControlEvents:UIControlEventValueChanged];
 [self.view addSubview:datePicker];

 UIToolbar *toolBar = [[[UIToolbar alloc] initWithFrame:CGRectMake(0, self.view.bounds.size.height, 320, 44)] autorelease];
 toolBar.tag = 11;
 toolBar.barStyle = UIBarStyleBlackTranslucent;
 UIBarButtonItem *spacer = [[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil] autorelease];
 UIBarButtonItem *doneButton = [[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(dismissDatePicker:)] autorelease];
 [toolBar setItems:[NSArray arrayWithObjects:spacer, doneButton, nil]];
 [self.view addSubview:toolBar];

 [UIView beginAnimations:@"MoveIn" context:nil];
 toolBar.frame = toolbarTargetFrame;
 datePicker.frame = datePickerTargetFrame;
 darkView.alpha = 0.5;
 [UIView commitAnimations];
}

I'd like to add my UIPicker with these values in the picker wheel:

  Days=[[NSArray alloc] initWithObjects: @"Today", @"Tomorrow", nil];
  Hours = [[NSArray alloc] initWithObjects:@"1", @"2", @"3", @"4", @"5", @"6", @"7", @"8", @"9", @"10", @"11", @"12", nil];
  Minutes=[[NSArray alloc] initWithObjects:@"05", @"10", @"15", @"20", @"25", @"30", @"35", @"40", @"45", @"50", @"55", nil];

Any help/guidance would be really appreciated!!

Thanks, Mat


Solution

  • You will need to use a UIPickerView instead of a UIDatePicker. You will then need to supply the proper delegate methods to provide the data for it.

    First create an array to hold items that will be available in the picker:

    NSMutableArray *arrayColors = [[NSMutableArray alloc] init];
    [arrayColors addObject:@"Red"];
    [arrayColors addObject:@"Orange"];
    

    Implement data source methods for picker:

    - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)thePickerView {
        return 1;
    }
    
    - (NSInteger)pickerView:(UIPickerView *)thePickerView numberOfRowsInComponent:(NSInteger)component {
    
    return [arrayColors count];
    }
    
    - (NSString *)pickerView:(UIPickerView *)thePickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    return [arrayColors objectAtIndex:row];
    }
    

    And the delegate method to get what item the user selected:

    - (void)pickerView:(UIPickerView *)thePickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    
    NSLog(@"Selected Color: %@. Index of selected color: %i", [arrayColors objectAtIndex:row], row);
    }
    

    Here is the documentation.

    Update

    To create a UIPickerView programmatically make sure it looks something like this:

    //Make sure our class knows we have picker delegate/data source methods in it
    @interface myViewController : UIViewController <UIPickerViewDataSource, UIPickerViewDelegate>
    

    The creation

    //Picker creation
    UIPickerView *myPickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 200, 320, 200)];
    myPickerView.delegate = self;
    myPickerView.showsSelectionIndicator = YES;
    [self.view addSubview:myPickerView];
    

    A handy delegate method

    // tell the picker the width of each row for a given component. no necessary but helpful if need be
    - (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component {
     int sectionWidth = 300;
    
     return sectionWidth;
    }