iPhone SDK: Your First iPhone Application

Published by Ralph Korvin 10 years ago

Cocoa Touch | IOS | IPhone | Objective-C | Xcode

iPhone Application Development

This entry is part 6 of 9 in the series iPhone Application Development

As we learn all the required topics to cover base of iOS SDK. Now its time to start our first iPhone Application Development. Let’s create your first iPhone Application.

First iPhone Application

Step 1. Create new project in Xcode. From the template selection, select iPhone and then select Single View Application. This the most basic template and we will use this in most of the application.

Step 2. Click on next. Then new screen appears, which allows you to specify your application name.

For Project Name specify FirstApp or whatever you want. Do the same for company identifier. For Device Family we have iPod, iPhone or both. Just for now select iPhone. Uncheck the use storyboard option as well as include Unit Tests option. We will use them later as we progresses.

Click on Next.

Step 3. Clicking on next will ask you to specify location for your project. Specify location and uncheck the git directory option for your project. Click create. This will create project name group in xcode, which contains 5 different files. I name my project FirstApp so I get following 5 files:

FirstAppAppDelegate.h
FirstAppAppDelegate.m
FirstAppViewController.h
FirstAppViewController.m
FirstAppViewController.xib

We will not touch first 2 files for now. Select FirstAppViewController.m file, which contains lots of prewritten code. Delete some methods so that your view controller’s implementation file will look like below:

Click on FirstAppViewController.xib file. Xcode opens user interface for your iPhone Application.

Step 4. Click on the third button from the view button group. Which is located at top right corner of Xcode window. This will bring a right sidebar in user interface.

Next click on third icon in Interface Builder Document from right sidebar.

This is just setting for proper environment to work on. Now without doing any change hit run and what you will see is iPhone Simulator, which is designed to test iPhone application in Xcode while developing.

Our application is running in iPhone Simulator. There’s nothing in it except a grey screen cause we haven’t inserted any code or done any design yet. This is the basic single view template that we are working on. iPhone Simulator gives you exact same output that you will get when you run same application in iPhone Device still it offers some limited functionality like it’s not supporting camera obviously and some other too. But for our purpose it’s fine.

Step 5. Let’s add some objects on user interface. Open FirstAppViewController.xib, on right sidebar from object library drag label, which is first, object by default and drop on user interface design. As you move label over user interface it starts guide you to position. Out it in center (guides will help you for that).

Now click on Run and see the result. Its similar to what we saw on User Interface. Pretty easy!

Step 6. This is static content. But let set this content by code instead of in design. To do that first have to link label to our View Controller and it’s easy. Open FirstAppViewController.xib file and from top right corner click on second editor button and your environment will bring that interface file just beside the user interface. Now hold down control key, drag label and drop on interface block, which then opens a popup that look similar to the below one:

Specify Name whatever you like and click on connect. Which will write following code in interface file:

{

UILabel *displayLabel;

}

@property (nonatomic, strong) IBOutlet UILabel *displayLabel;

Just remove that {} code (code highlighted above) cause we will do that in different way. Now open implementation file and code similar to below is also written. (see highlighted code)

@implementation FirstAppViewController

@synthesize displayLabel;

#pragma mark - View lifecycle

- (void)viewDidLoad

{

[super viewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

}

- (void)viewDidUnload

{

[self setDisplayLabel:nil];

[super viewDidUnload];

// Release any retained subviews of the main view.

// e.g. self.myOutlet = nil;

}

@end

update @synthesize as follows:

1	@synthesize displayLabel = _displayLabel;

Remember we do that while declaring properties in class. Now update viewDidLoad method in implementation file as follow:

- (void)viewDidLoad

{

[super viewDidLoad];

self.displayLabel.text = @"Code Riddles!";

// Do any additional setup after loading the view, typically from a nib.

}

we can also write this line with using square brackets like this:

[[self displayLabel] setText:@”Code Riddles”];

viewDidLoad method invokes when our view(user interface) is loaded in memory. At that time we are updating the displayLabel’s Text Property, which is linked to the label we put in user interface. Now hit run and see the output.