In the last tutorial we created a very basic counting app. In this one we're going to be looking at the Date Picker for the iPhone. The Date Picker is a common part of iOS, and is seen in your Settings. In this tutorial we'll be looking at how to add one to your view, and how to link it to a label, a text field, and a push notification.

If this is your first time reading one of my tutorials, i suggest you go down to the bottom, find the link to my List of Xcode threads, and start with the first one. I explain things in much greater detail in that one.

So start by opening Xcode, starting a view based or single view application, and naming it Date Picker. This should by now be very familiar.

Now we'll go into our .h, and add a UIDatePicker, two IBOutlets, an @property, and an IBAction.

Start by adding a curly bracket on the @implementation line, like so:



Next we'll add the outlets and the UI element.

Type:
Code:
	UIDatePicker *datepick ;
	IBOutlet UILabel *label ;
	IBOutlet UITextField *textfield;
}
Once again, by now this should be extremely simple for you to understand. The IBOutlets declare our label and textfield as variables, named label and textfield. UIDatePicker tells Xcode that we're going to have a UI element, a date picker, and that it's referenced as date pick.

Your .h should look like this:



Next we're going to add our action and our property.
Code:
-(IBAction)button ;
@property (nonatomic, retain)IBOutlet UIDatePicker *datepick ;
Basically, the @property line tells Xcode to link together our IBOutlets and our date picker. The IBAction statement just declares our action to be named button, as you already know.

Your .h should look like this now:



We're done with the .h now, we can move on to the .m

First we're going to add a line right below our @implementation, a @synthesize.
Code:
@synthesize datepick ;
This just tells Xcode to create our Date Picker that we named date pick.

Now your .m should look like this at the top:



Next we'll be defining what our IBAction that we created before does.

This is a big line of code, so be prepared. Next we'll add:
Code:
-(IBAction)button {
	NSDate *choice = [datepick date] ;
	NSString *words = [[NSString alloc]initWithFormat:@"The date is %@",choice] ;

	UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@"The Title" message:words delegate:nil cancelButtonTitle:@"Dismiss" otherButtonTitles:nil, nil] ;
	[alert show] ;

	label.text = words ;
	textfield.text = words ;
}
Got all that? The first line defines what our button does, of course. The next few lines declare your date picker, your outlets, and a push notification alert.

Your .m should now look like this:



Next we're going to go down to the viewDidUnload default code that Apple provides, and add one line in that.
Code:
self.datepick = nil
Refer to the highlighted text below to see where to place the above code:



That's it for coding, now we'll move on to our .storyboard and we can begin creating our view.

Once in the .storyboard we're going to need a date picker, a round rect button, a text field, and a label.



Place the date picker at the bottom of the view, center the button right above it, and enlarge the textfield and place it at the top. Increase the size of the label to the same size as the textfield, and place it right above it.

It should look something like this:



Next we'll open up our Connection Inspector in the right column, and drag each outlet to it's respective element on the view. datepick to the date picker, label to the label, etc. Then, under Received Actions, drag button to our round rect button, and select Touch Up Inside as the action.



Now we can click Run, and test it.

Thanks for reading, if you have any questions leave them below.

Check out this thread for all of my Xcode Tutorials.