iPhone Says Hello

I finally got around to down­load­ing the iPhone SDK to see what I can do with it. Since I’ve dab­bled in game devel­op­ment back when I worked with Flash and Direc­tor, I fig­ured I’d see what I can do with the iPhone. I wanted to start with a frame­work and I looked at Torque and Unity. Though inex­pen­sive by game engine stan­dards, dur­ing a reces­sion­ary time of cost cut­ting, it’s hard to val­i­date a nearly $1000 pur­chase, espe­cially if you don’t know yet if that invest­ment would pay off. So I finally set­tled on the cocos2d-iphone frame­work which is based on the cocos2d frame­work for Python. There is lit­tle to no doc­u­men­ta­tion, so be pre­pared to read source code. Mon­o­cle Studio’s whitepa­per will def­i­nitely help you boot­strap your project. In the spirit of that paper, I thought I’d share my trans­la­tion of the cocos2d “Hello, World” exam­ple adapted for the cocos2d-iphone framework.

First step is to setup your project accord­ing to Mon­o­cle Studio’s whitepa­per through “Clean­ing up the project” right before “Cre­at­ing a main menu”. That’ll cre­ate the base project. You’ll prob­a­bly want to change the name to some­thing else (e.g. CocosHel­loWorld) instead of Sim­pleGame. Make sure to change the name where appro­pri­ate, for exam­ple Sim­pleGameAp­pDel­e­gate should be YourAppNameAppDelegate.

Cre­ate the Hel­loWorld class

1. Click the Classes group in Groups & Files pane.
2. Click the Action button
3. Select Add->New File…
4. Choose NSOb­ject subclass
5. Name the class “HelloWorld”

Open HelloWorld.h and change the code to look like the fol­low­ing. This says that the Hel­loWorld class is derived from the Layer class (which is derived from the CocosNode class).

#import <UIKit/UIKit.h>
#import "cocos2d.h"

@interface HelloWorld : Layer {

}
@end

Open HelloWorld.m and change the code to the fol­low­ing. This says that the Hel­loWorld class uses its par­ent class for ini­tial­iza­tion. If the ini­tial­iza­tion is suc­cess­ful, then cre­ate a new label, place it in the cen­ter, and add it to the layer. Finally, it returns itself.

#import "HelloWorld.h"

@implementation HelloWorld

- (id) init {
    self = [super init];
    if (self != nil) {
		Label *label = [Label labelWithString:@"Hello, World!" 
									 fontName:@"Times New Roman" 
									 fontSize:32];
		label.position = cpv(240,160);
		[self add:label];
    }
    return self;	
}

@end

Setup the Director

Open up YourAppNameAppDelegate.h and change the include dec­la­ra­tions to:

#import <UIKit/UIKit.h>
#import "cocos2d.h"
#import "HelloWorld.h"

Next open YourAppNameAppDelegate.m and change it to the fol­low­ing. The dif­fer­ence between this and the cor­re­spond­ing method in Sim­pleGame are the last two lines. The first cre­ates a Scene node and adds a Hel­loWorld node to the scene. The next line starts the Direc­tor using the just cre­ated Scene as the ini­tial scene. The pre­vi­ous set of lines pre­pare the iPhone dis­play by ini­tial­iz­ing a win­dow, enabling the UI for the win­dow, set­ting the Direc­tor to dis­play in land­scape mode, then attach the Direc­tor to the win­dow, and finally mak­ing the win­dow the main win­dow and turn­ing it on.

#import "CocosHelloWorldAppDelegate.h"

@implementation CocosHelloWorldAppDelegate

- (void)applicationDidFinishLaunching:(UIApplication *)application {    
    UIWindow *window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    [window setUserInteractionEnabled:YES];
    [window setMultipleTouchEnabled:YES];
    [[Director sharedDirector] setLandscape: YES];
    [[Director sharedDirector] attachInWindow:window];
	
    [window makeKeyAndVisible];
	
    Scene *s = [[Scene node] add:[HelloWorld node]];
	
    [[Director sharedDirector] runWithScene:s];	
}

@end

If all is well, if you click Build & Go the iPhone sim­u­la­tor should dis­play “Hello, World!”.