UIDatePickerView control

In this post I we will see a demonstration of UIDatePickerView

Design Phase: For this demo we will take a segment control, a label and a datePicker view and on the selected index of the segmented control we will try to change the modes of the datepicker view the different modes available for datepickers are as follows

1. UIDatePickerModeTime
2. UIDatePickerModeDate
3. UIDatePickerModeDateAndTime
4. UIDatePickerModeCountDownTimer

The default mode is UIDatePickerModeDateAndTime

our final view looks like this 

Step 1: Open Xcode and create a new window based application project add UIViewController subclass file and name them Myview.

Step 2: Go to the .h file of Myview and declare objects of the segmented control, label and picker also you need to declare a method which will be called when the value of the segmented control will change, so here's how the code looks

@interface Myview : UIViewController {

UIDatePicker *datePicker;

UISegmentedControl *segmentedControl;

NSArray *modes;

UILabel *lbl;

}

-(void)changePickerView:(UISegmentedControl*) sender;

@end

Now go to the .m file of the Myview class and into its init method start giving the frame and text to your controls here's how you do that

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {

if (self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil]) {

// Custom initialization

//setting the frame of the date picker

datePicker = [[UIDatePicker alloc]initWithFrame:CGRectMake(1, 216, 320, 216)];

//settings for the segmented control

modes = [[NSArray alloc]initWithObjects:@"1",@"2",@"3",@"4",nil];

segmentedControl = [[UISegmentedControl alloc]initWithItems:modes];

[segmentedControl setFrame:CGRectMake(20, 144, 280, 44)];

segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;

[segmentedControl setBackgroundColor:[UIColor blackColor]];

[segmentedControl addTarget:self action:@selector(changePickerView:) forControlEvents:UIControlEventValueChanged];

//settings for the label

lbl = [[UILabel alloc]initWithFrame:CGRectMake(53, 95, 217, 21)];

lbl.hidden = YES;

[lbl setBackgroundColor:[UIColor blackColor]];

lbl.textColor = [UIColor whiteColor];

lbl.adjustsFontSizeToFitWidth = YES;

//setting the background color to black

[self.view setBackgroundColor:[UIColor blackColor]];

}

return self;

}

Now into the loadView method add these view

- (void)loadView {

[super loadView];

[self.view addSubview:datePicker];

[self.view addSubview:segmentedControl];

[self.view addSubview:lbl];

}

Step 3: Now coming to our function that we made earlier called as

-(void)changePickerView:(UISegmentedControl*) sender

here's how the body of this function looks

-(void)changePickerView:(UISegmentedControl*) sender

{

switch (sender.selectedSegmentIndex) {

case 0:

datePicker.datePickerMode = UIDatePickerModeTime;

lbl.hidden = NO;

lbl.text = @"UIDatePickerModeTime";

break;

case 1:

datePicker.datePickerMode = UIDatePickerModeDateAndTime;

lbl.hidden = NO;

lbl.text = @"UIDatePickerModeDateAndTime";

break;

case 2:

datePicker.datePickerMode = UIDatePickerModeDate;

lbl.hidden = NO;

lbl.text = @"UIDatePickerModeDate";

break;

case 3:

datePicker.datePickerMode = UIDatePickerModeCountDownTimer;

lbl.hidden = NO;

lbl.text = @"UIDatePickerModeCountDownTimer";

break;

}

}

The above code is quite self explanatory I have changed the mode of the date picker on the basis of the index change of the segmented control.

Step 4: Go to the AppDelegate.m file and add this view to your window and your all done

#import "DateTimePickerDemoAppDelegate.h"

#import "Myview.h"

@implementation DateTimePickerDemoAppDelegate

@synthesize window;

- (void)applicationDidFinishLaunching:(UIApplication *)application {

// Override point for customization after application launch

Myview *MyviewVC = [[Myview alloc]init];

[window addSubview:MyviewVC.view];

[window makeKeyAndVisible];

}

Step 5: Run the application by pressing the Build and Go and you will get the below result

UIDatePickerModeCountDownTimer

UIDatePickerModeDate

UIDatePickerModeTime

Getting the date and time from the UIDatePicker is quite simple all you have to do is use a method called date of the UIDatePicker and you are done

NSLog(@"%@",[datePicker date]);

The above code will give you the current date and time printed in the log

If you want to specify the date format as "MM-DD-YYY" or some other format then use the below code that would be useful to you

-(void) getDate

{

NSDate *date = [datePicker date];

NSDateFormatter *formatter = [[NSDateFormatter alloc]init];

//specify the date format that you want

[formatter setDateFormat:@"dd-MM-YYYY"];

lbl.text = [formatter stringFromDate:date];

}

Code Explanation: In the above code i have associated the selected date form the Date Picker and displayed it in the label, for this i have used the NSDateFormatter class which provides you flexibility to specify your date styles and formats as per your project requirement.

The setDateFormat function will take the input for the format that you want to specify and the second method that's stringFromDate will return a string representation of a given date formatted using NSDateFormatter class instance

i hope this post helped you, Happy iCoding and have a great Day