The best way to learn a new language and framework is to simply dive right in. This tutorial is going to show you how to create a basic ‘Hello World’ application programmatically – without the help of a visual designer.
- The first thing you need to do is download and install the iPhone SDK which is totally free. This is going to give you everything you need in order to build apps – XCode, iPhone Simulator, and Interface Builder.. For the purposes of learning, the simulator works just fine but if you want to run the app on a real iPhone or distribute it to the app store, you’ll have to pay $99.
- After you’ve got all that stuff installed, you’re ready to go ahead and start. Start off by launching XCode which by default is installed in the Developer folder.
When you launch XCode, select File > New Project to bring up the project templates.
The Window-Based Application is very simple. What this template is going to give is a Window and an application delegate. An object that responds to messages from a UIApplication object is called an application delegate (UIApplicationDelegate). There can be only one UIApplication object, and the project template takes care of creating it for us. When you click Choose, you'll now be prompted for a project name. For our example, we will name it "HelloWorld".
Once the project is saved or created, you'll be presented with the XCode interface and all of the files the project template has generated for you.
The important files are main.m, HelloWorldAppDelegate.h, and HelloWorldAppDelegate.m. The single UIApplication object is created in the main function. The function call UIApplicationMain() takes care of that.
Now let's check out the implementation of the delegate, HelloWorldAppDelegate.m. The template has already created -applicationDidFinishLaunching
- (void)applicationDidFinishLaunching:(UIApplication *)application {
// Override point for customization after application launch
[window makeKeyAndVisible];
}
We will be creating our view controller in this function which will eventually hold our 'Hello World' label object. We need to add another class to our project that subclasses UIViewController in order to create a view controller. Fortunately, since is a common task, XCode has a template for creating view controllers. Right click mouse on the Classes folder and choose Add > New File.
When you click Next, you'll be presented with some options. The only thing you should have to set is the filename. For example we will have it named HelloWorldViewController. . View controllers are meant to be used by overriding the base implementation of various methods that’s why you might notice that the new implementation file (HelloWorldViewController.m) is full of commented out functions. In our example, we will override loadView, which is used to manually populate a view controller.
// Implement loadView to create a view hierarchy programmatically,
// without using a nib.
- (void)loadView {
}
We're almost done. Controls are added to a UIView, which is a property of the view controller and not added directly to the view controller. The view, however, is not allocated yet, so we're going to start there. We need to create a UIView object that is the size of our display and set it to the view controllers view property.
- (void)loadView {
//create a frame that sets the bounds of the view
CGRect frame = CGRectMake(0, 0, 320, 480);
//allocate the view
self.view = [[UIView alloc] initWithFrame:frame];
//set the view's background color
self.view.backgroundColor = [UIColor whiteColor];
}
We will first create a CGRect object that will act as the bounds for our view. We will have the view positioned at (0, 0) and the total size of the iPhone display be (320, 480). View controllers have a view property that needs to be set to our new UIView object. Lastly, we can simply set the background color property to white.
Now we can already create a label to hold our "Hello World" text.
- (void)loadView {
//create a frame that sets the bounds of the view
CGRect frame = CGRectMake(0, 0, 320, 480);
//allocate the view
self.view = [[UIView alloc] initWithFrame:frame];
//set the view's background color
self.view.backgroundColor = [UIColor whiteColor];
//set the position of the label
frame = CGRectMake(100, 170, 100, 50);
//allocate the label
UILabel *label = [[UILabel alloc] initWithFrame:frame];
//set the label's text
label.text = @"Hello World!";
//add the label to the view
[self.view addSubview:label];
//release the label
[label release];
}
We need to create again another CGRect object because we need to specify where we'd like the label to be.We then allocate the label and initialize it with the bounds we just created. Next up we will set the text to "Hello World!" and add the label to the view. Whenever you're done with a reference, you need to call release because Objective-C uses reference counting to automatically delete objects,
We now have a view controller with a label that will display the text, "Hello World". Now we need to create an instance of this view controller and add it to our application. Again, we’ll be creating our view controller in the function, applicationDidFinishLaunching.
Add an import statement at the top of that file (HelloWorldAppDelegate.m) so the compiler can find the declaration of that object.
#import "HelloWorldAppDelegate.h"
#import "HelloWorldViewController.h"
Just add it right under the existing import statement. Now we're ready to create the view controller.
- (void)applicationDidFinishLaunching:(UIApplication *)application {
//allocate the view controller
self.viewController = [HelloWorldViewController alloc];
//add the view controller's view to the window
[window addSubview:self.viewController.view];
[window makeKeyAndVisible];
}
Just like before, we simply allocate a new HelloWorldViewController. We don't add the view controller directly to the window; rather we add its view property to the window.
We will then create a property called viewController to store the view controller.
Properties are defined in the .h file. Here's the modified HelloWorldAppDelegate.h file.
#import <UIKit/UIKit.h>
@class HelloWorldViewController;
@interface HelloWorldAppDelegate : NSObject <UIApplicationDelegate> {
UIWindow *window;
HelloWorldViewController *viewController;
}
@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) HelloWorldViewController *viewController;
@end
The @class HelloWorldViewController is a forward declaration. Basically we're telling the compiler a class with this name exists. We declare a member variable to hold our view controller in the @interface section,. Lastly, we use @property to wrap our member variable with implicit get and set functions.
We now need to tell the compiler to actually create the get and set functions for our new property. We do that back in the .m file with @synthesize.
@synthesize window;
@synthesize viewController;
The very last thing we need to do is release our reference to the view controller when the dealloc is called. There should already be a dealloc function in the .m file. We just need to add a little to it.
- (void)dealloc {
[viewController release];
[window release];
[super dealloc];
}
And there we have it. The final HelloWorldAppDelegate implementation file should look like this:
#import "HelloWorldAppDelegate.h"
#import "HelloWorldViewController.h"
@implementation HelloWorldAppDelegate
@synthesize window;
@synthesize viewController;
- (void)applicationDidFinishLaunching:(UIApplication *)application {
//allocate the view controller
self.viewController = [HelloWorldViewController alloc];
//add the view controller's view to the window
[window addSubview:self.viewController.view];
[window makeKeyAndVisible];
}
- (void)dealloc {
[viewController release];
[window release];
[super dealloc];
}
@end
We're done! You should see something that looks like the image below, if you build and run the app (Build > Build and Go).