First you’ll need to make sure you’ve installed the most current iPhone SDK.   If you haven’t installed the SDK go to Apple’s site, find it, download it, and install it.  It is pretty easy and there isn’t much to it.  The SDK includes XCode (development environment), Interface Builder, and the iPhone Simulator.  You’ll need all of these to start developing your first application.

Now that you have installed the SDK you’ll need to find XCode and open the program.  Once you’ve opened  XCode you’ll need to decide what type of application template you’ll want to create.  For this tutorial you’ll want to use a View-based Application template and name the project HelloWorld.   Now that you have created the View-based Application project XCode will open it’s IDE that includes several folders and files.  You’ll see the Classes, other Sources, Resources, Framework, Project directories.  You won’t need to know what each of these directories are used for to complete this tutorial, but I do recommend navigating through each one of these directories and looking at the files included.  This will give you a good idea what a normal iPhone View-based Application includes.  At least it will get you thinking about what is there.

So it is time to start coding and if you’ve gotten this far you’re probably ready to start.   Under the Classes directory in XCode you should see four files, two app delegate files and two view controller files.  At this point we’ll only need to worry about the files called HelloWorldViewController.h and HelloWorldViewController.m.  These files are called the header and implementation files.  I’m sure you can guess which one is the header file (.h).  You’ll need to click the HelloWorldViewController.h and add a few lines of code into the file.

You’ll want to add two IBOutlets which define the two controls we will be including on our interface–a button called button and label called label.  I know, how creative of me…

@interface HelloWorldViewController : UIViewController {
// IBOutlet list
IBOutlet UIButton *button;
IBOutlet UILabel *label;
}

So now that you’ve added the IBOutlets you’ll need to add code to access these IBOutlets called properties.

You’ll really only need access to the label control or “IBOutlet”, but it is a good habit to just include all your variables or IBOutlets in your properties list unless there is a good reason to not allow access. To add your properties you’ll want to add the following code right below the closing bracket of your interface.

// properties to access the controls or variables
@property (nonatomic, retain) UIButton *button;
@property (nonatomic, retain) UILabel    *label;

Now that we’ve added the IBOutlets and properties we’ll now want to add a method declaration to set that label to “Hello World”.  This is only a declaration, so that we can access the sayHello method in our implementation file upon a particular IBAction–for instance a button click.  Add this code below the @property list.

// methods list
- (IBAction) sayHello;

We are now finished with the header file now lets get started on our implementation file.

Click the HelloWorldViewController.m and we’ll get started.

We have to do two things here add our @synthesize statements and add the sayHello method we declared in our header file.

#import “HelloWorldViewController.h”

@implementation HelloWorldViewController

@synthesize label;
@synthesize button;

@synthesize statements are an easy way to create get/set statements.  If you don’t know what get/set statements are–basically they are statements to get or set values of a variable such as our label and button.

The code we need to write for the sayHello method is very simple and a hello world app should be simple right.  Copy and paste this write below your synthesize statements.

- (IBAction) sayHello {
label.text = @”Hello World”;
}

Now that we have written the code we’ll need to create our interface and connect the outlets and actions to our controls.

To access Interface Builder go to the Resources folder and double click the nib file HelloWorldViewController.xib.  Once you click on this file Interface Builder should open.  Sometimes it is slow to open so be patient.   When Interface Builder opens you should see four windows nib file window, view window, inspector window (which include the attribute, connections, size and identity tabs), and the library window. You’ll need to use all of these windows to create our interface.  First you’ll want to drag a button and label over to the view from the Library’s Cocoa Touch – Input & Values section which is found in the Objects area.  Place them however you want for this project.  Once you have them on the view you’ll want to set some of their attributes.  Select the button, by clicking on it, and then go to the Inspector window and select the Identity tab.  You’ll want to set the name to button. Now do the same thing for the label–select the label go to the Identity tab and set it’s name to label. Now if you want to set the text in the button just double click inside the button and add the words “Click this” or whatever you’d like.   This isn’t really important.  Now we need to create the connections.

Interface Builder helps us connect our outlets and actions.  To do this you’ll need to select the File’s Owner object in the nib file window.  Click it while holding down the control key and dragging over to the button and label separately.  Once you are let go while hovering over the label and button you’ll need to select the outlet name associated to that control.    To connect the setHello method you’ll need to click the button while holding down the control key and hovering and letting go over the File’s Owner object in the nib file window.  Once you let go over the File’s Owner object you should be able to select the sayHello action.

If you’ve done all this successfully you’ll be ready to build the application and test it in the iPhone Simulator.  You can do this simply by going back to XCode and clicking the Build and Run button.  Once you click Build and Run the iPhone Simulator will open and automatically open the HelloWorld application.  At this point you should be able to click the button and view “Hello World” as the label’s text.

I hope this helps you create your first iPhone application.  If you have any problems with completing this successfully please let me know by commenting on this post.

Happy Programming!

-JAH

http://thbi.wordpress.com/2009/11/12/three20/

http://developer.apple.com/iphone/index.action

http://developer.apple.com/profiles/

http://developer.apple.com/technology/

http://www.stanford.edu/class/cs193p/cgi-bin/index.php