Friday, November 12, 2010

How to Use UIDatePicker From UIKit in iPhone Programming


Here is a great way to ask your users to input dates on your iPhone app.
When you use UIDatePicker in your app you will a tumbler that lets users select a date that you may use in other parts of your app.
In order to use UIDatePicker you will need to implement the UIPickerViewDelegate delegate and then add a UIPicker to your subview. To retrieve the date that the user inputs you can use the target-action pattern to assign a method to execute once the user has picked a date.

Here is the code from the example:

Implement the UIDatePickerView Delegate

The first thing we needed to do was indicate that our view controller would be acting as a delegate for the UITextField. To do this you simply need to declare it in the interface file:
#import <UIKit/UIKit.h>

//UIPicker requires an object that adopts the UIPickerViewDelegate protocol
@interface DatePicker : UIViewController<UIPickerViewDelegate> {

}

@end

Add the UILabel and UIDatePicker Objects

This part is straightforward enough: you essentially create a label and a date picker and add them both to the view controller’s subview collection. This is the typical pattern used to build up a view in code.
#import "DatePicker.h"

@implementation DatePicker
UILabel *label;
UIDatePicker *datePicker;

- (void)viewDidLoad {
    [super viewDidLoad];

 //Create label
 label = [[UILabel alloc] init];
 label.frame = CGRectMake(10, 10, 300, 40);
 label.textAlignment = UITextAlignmentCenter;

 //Use NSDateFormatter to write out the date in a friendly format
 NSDateFormatter *df = [[NSDateFormatter alloc] init];
 df.dateStyle = NSDateFormatterMediumStyle;
 label.text = [NSString stringWithFormat:@"%@",
     [df stringFromDate:[NSDate date]]];
 [df release];
 [self.view addSubview:label];
 [label release];

 // Initialization code
 datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 250, 325, 250)];
 datePicker.datePickerMode = UIDatePickerModeDate;
 datePicker.hidden = NO;
 datePicker.date = [NSDate date];
 [datePicker addTarget:self
                action:@selector(changeDateInLabel:)
      forControlEvents:UIControlEventValueChanged];
 [self.view addSubview:datePicker];
 [datePicker release];
}

- (void)dealloc {
 [datePicker release];
 [label release];
 [super dealloc];
}

@end

Implement Your Action Method

This is the method that you assigned to the UIControlEventValueChanged event above using the target-action pattern.
- (void)changeDateInLabel:(id)sender{
 //Use NSDateFormatter to write out the date in a friendly format
 NSDateFormatter *df = [[NSDateFormatter alloc] init];
 df.dateStyle = NSDateFormatterMediumStyle;
 label.text = [NSString stringWithFormat:@"%@",
              [df stringFromDate:datePicker.date]];
 [df release];
}
How this works is that when the user stops manipulating the tumbler an event called UIControlEventValueChanged occurs. Since we assigned the changeDateInLabel method as an action for this event the code in that method will execute updating the date in the label.

Time To Take Action!

Learning how to program is 5% reading and 95% action so the best way to learn is to do it yourself. Create a simple iPhone app that uses the date picker code.
Let us know how it goes in the comments below!

No comments:

Post a Comment

Followers