cocos2d for beginners

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

Upload: azukisoft-pte-ltd

Post on 08-May-2015

1.940 views

Category:

Entertainment & Humor


6 download

DESCRIPTION

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

TRANSCRIPT

Page 1: Cocos2d for beginners

Cocos2Dfor iOSByGibson TangAzukisoft Pte Ltd22 – 12 - 2012 (The day after the Mayan prediction of the end of the world)

Page 2: Cocos2d for beginners

Who Am I?Mobile Developer since 2004

Ex Nokia Symbian

Ex J2ME developer

Currently Android and iPhone developer

Binary size max is 64 kb, not 64 MB

Page 3: Cocos2d for beginners

What is Cocos2DPopular Objective-C game engine

Easy to use

Tons of support

Open source and free (Very important)

Page 4: Cocos2d for beginners

Cocos2DUsed in thousands of games

Creator of Cocos2D was acqui-hired by Zynga

Yes, the Zynga whose stock is tanking now

Page 5: Cocos2d for beginners
Page 6: Cocos2d for beginners

What is Cocos2DHas a lot of ports

Cocos2d-x for Android and cross platform

Cocos2d html5

Cocos2d for Blackberry etc

Page 7: Cocos2d for beginners

What is Cocos2Dhttp://www.cocos2d-iphone.org/download

Go download it now

Page 8: Cocos2d for beginners

Cocos2DDirector – 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

Page 9: Cocos2d for beginners

Cocos2D

Page 10: Cocos2d for beginners

ScenesThink of a scene as a screen

So in a game, you may have a• Starting scene• Gameplay scene• Results sceneetc

Page 11: Cocos2d for beginners

LayersA scene can have > 1 layers

Think of a layer in the same vein as a layer in a Photoshop PSD file

Same concept

Page 12: Cocos2d for beginners

CCNodeCCNode is the base class that almost all Cocos2D classes inherit from

This has common properties such as - Position- Z order- Tag- etc

Page 13: Cocos2d for beginners

OriginThe coordinate system starts from bottom left of screen

0,0 X

Y

Hope you still remember your Cartesian Math

Page 14: Cocos2d for beginners

Cocos2DAll classes and objects have the prefix ‘CC’

• CCSprite

• CCAction

• CCMoveBy

etc

Page 15: Cocos2d for beginners

CCSpriteAn image object that loads in a png file

CCSprite *sprite = [CCSprite spriteWithFile:@”man.png”];

Page 16: Cocos2d for beginners

Sprite MovementCocos2d 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

Page 17: Cocos2d for beginners

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

Page 18: Cocos2d for beginners

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

Page 19: Cocos2d for beginners

UIKitSo what happens if you want to integrate UIKit element?

• Textfield

• Alertview

• Webview

Can you do that with Cocos2D?

Page 20: Cocos2d for beginners

UIKitYes, 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];

Page 21: Cocos2d for beginners

UIKit

Page 22: Cocos2d for beginners

UIKitYes, 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];

Page 23: Cocos2d for beginners

UIKit

Page 24: Cocos2d for beginners

UIKitYes, you can also add your xibs into Cocos2D

http://www.raywenderlich.com/4817/how-to-integrate-cocos2d-and-uikit

Page 25: Cocos2d for beginners

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

Page 26: Cocos2d for beginners

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

Page 27: Cocos2d for beginners

It’s Demo TimeI 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

Page 28: Cocos2d for beginners

Download Code

•http://www.azukisoft.com/HelloiOSDevs.zip