Cocos2d iPhone game development given for the iOS Dev Scout on 22nd Dec 2012 conducted at Blk 71 Plug-in. Yummy food courtesy of IDA

1. Cocos2D
for iOS
By
Gibson Tang
Azukisoft Pte Ltd
22 – 12 - 2012
(The day after the Mayan prediction of the end of the world)

2. Binary size max is
64 kb, not 64 MB
Who Am I?
Mobile Developer since 2004
Ex Nokia Symbian
Ex J2ME developer
Currently Android and iPhone
developer

3. What is Cocos2D
Popular Objective-C game engine
Easy to use
Tons of support
Open source and free (Very important)

4. Cocos2D
Used in thousands of games
Creator of Cocos2D was acqui-hired by
Zynga
Yes, the Zynga whose stock is tanking now

6. What is Cocos2D
Has a lot of ports
Cocos2d-x for Android and cross platform
Cocos2d html5
Cocos2d for Blackberry etc

7. What is Cocos2D
http://www.cocos2d-iphone.org/download
Go download it now

8. Cocos2D
Director – The guy that calls the shots
Scenes – Director manages scenes
Layers – Scenes can comprise of 1 or more
layers
It is a game engine based on concept of
nodes

9. Cocos2D

10. Scenes
Think of a scene as a screen
So in a game, you may have a
• Starting scene
• Gameplay scene
• Results scene
etc

11. Layers
A scene can have > 1 layers
Think of a layer in the same vein as a layer in
a Photoshop PSD file
Same concept 

12. CCNode
CCNode is the base class that almost all
Cocos2D classes inherit from
This has common properties such as
- Position
- Z order
- Tag
- etc

13. Origin
The coordinate system starts from bottom
left of screen
Y
Hope you still remember
your Cartesian Math
0,0
X

14. Cocos2D
All classes and objects have the prefix ‘CC’
• CCSprite
• CCAction
• CCMoveBy
etc

15. CCSprite
An image object that loads in a png file
CCSprite *sprite = [CCSprite
spriteWithFile:@”man.png”];

16. Sprite Movement
Cocos2d has a vast array of actions
• Movement
• Scaling
• Fading
• Rotation
• etc
• http://www.cocos2d-iphone.org/api-
ref/2.1.0/interface_c_c_action.html

17. Sprite
• After loading a sprite
• Need call the ‘add’ method
• To add the sprite to another sprite
• Or add to a scene
• Then the game engine handles
the rendering for you
• Easy as Pie

18. Sprite Basics
CCSprite *sprite = [CCSprite
spriteWithFile:@”man.png”];
• [self addChild:sprite];
• [sprite runAction:[CCMoveTo
actionWithDuration: 2.0f
position:ccp(240, 320)]];
This moves man.png to position 240, 320
using 2 seconds

19. UIKit
So what happens if you want to integrate UIKit
element?
• Textfield
• Alertview
• Webview
Can you do that with Cocos2D?

20. UIKit
Yes, you can. Most common way is to add them
in using code
UIAlertView* alert_view = [[UIAlertView
alloc] initWithTitle:@”Title"
message:@"Your Message" delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert_view setDelegate:self];
[alert_view show];
[alert_view autorelease];

21. UIKit

22. UIKit
Yes, you can. Most common way is to add
them in using code
UIView *myView = (UIView*) [[CCDirector
sharedDirector] openGLView];//get the view
textField = [[UITextField alloc]
initWithFrame:CGRectMake(40, 168, 250, 40)];
[myView addSubview:textField];
[[[[CCDirector sharedDirector]openGLView]
window]addSubview:myView];
[myView setDelegate:self];

23. UIKit

24. UIKit
Yes, you can also add your xibs into Cocos2D
http://www.raywenderlich.com/4817/how
-to-integrate-cocos2d-and-uikit

25. Audio
• To play audio is very simple
• Just #import “SimpleAudioEngine.h”
• Then call the methods to play the audio
• Background music
• Effect
• mp3, wav, caf (Core Audio Format) files can be
used

26. Audio
• [[SimpleAudioEngine sharedEngine]
preloadEffect:@"sfx.wav"];
//sfx.wav is the name of the sound file
• [[SimpleAudioEngine sharedEngine]
playEffect:@"sfx.wav"];
//play the audio file sfx.wav
• [[SimpleAudioEngine sharedEngine]
playBackgroundMusic:@"bgm.mp3"];
//play the bgm.mp3 background music

27. It’s Demo Time
I am going to show you how to create a
simple game
- Game mechanics is simple
- Tap the snails to squash them
- Before they reach the end of the screen
- It won’t be the next Angry Birds
- But it’s a start

28. Download Code
• http://www.azukisoft.com/Helloi
OSDevs.zip