Desenvolvimento de Jogos     com Cocos2d  André “xorna” Espeiorin
@xornaSócio/Programador/Eletrecista da CodeRockrProgramador LAMPProgramador iOSentre outras coisas
Um pouco sobre o Cocos2dOpen Source (BSD e MIT License)Relativamente Novo (stable release em 2010)Comunidade CrescenteMult...
Versões do Cocos2dOriginal escrita em Python (multi-plataforma)Portada em Objective-C (Plataforma Apple)Portada em Java (A...
Cocos2d para iOSVersão Atual 1.0.1Muito utilizado, desde desenvolvedores Indiesaté Zynga e AtariEngines Físicas embarcadas...
Cocos2d para iOSSprite SheetsSuporte a Tiled MapsSistema de PartículasRenderização de textoIntegração com o Game CenterEnt...
Toda a plataforma Apple
Exemplos
Zynga: FarmVille
Pro Zombie Soccer
Pro Zombie Soccer
Pro Zombie Soccer
Zombie Smash
Zombie Smash
Zombie Smash
Zombie Smash
Zombie Smash
O que preciso para começar?Ambiente de desenvolvimento Apple: Mac Mac OS X Xcode com iOS SDK Cocos2dConhecimentos: Objecti...
Conceitos BásicosScenesDirectorLayersSprites
ScenesClasse CCSceneUma “Cena”, “Tela” ou “parte” do jogoApenas uma cena é apresentada por vezExemplos: Menu, Fase X, Tela...
DirectorClasse CCDirector“Dirige” o gameTransições, mudança de cenaResponsável por tudo por trás das CenasResponsável pela...
LayersClasse CCLayerÁrea “Utilizável” da CenaPodem ser usadas várias “camadas”Definem aparência e comportamento da cenaPode...
Layers (Exemplo)
Layers (Exemplo)
SpritesClasse CCSpriteImagem 2D que pode ser transformadaPode conter outros SpritesTransformações no Sprite são propagadas...
Touch ScreenMuito mais possibilidadesMuito mais responsabilidadesUm pouco mais de trabalho para manipulareventosO Cocos2d ...
Standard TouchMesmos eventos do CocoaTouchAtivado pela propriedade:self.isTouchEnabled = YES;Protocolo CCStandardTouchDele...
Targeted TouchAo contrário do Standard, ele notifica um únicotoque por vezPara ativar as Notificações, você deve “registrar”...
Targeted Touch Delegate@protocol CCTargetedTouchDelegate <NSObject>- (BOOL)ccTouchBegan:(UITouch *)touch withEvent:(UIEven...
Qual devo usar?Standard se você precisa de manipular váriostoques simultâneosTargeted se você procura algo simples, comape...
Ações BásicasMover elementosRotacionar elementosMostrar/Esconder elementosRedimensionar elementosTodas as ações podem ser ...
Ações CompostasExecutar Ações em sequênciaExecutar várias Ações ao mesmo tempoRepetir AçõesRepetir Ações em looping
Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração
Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração    linear
Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração    linear   ...
Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração    linear   ...
Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração    linear   ...
Ações EspeciaisCallFunc / CallBlockChamar methodo após execução de uma Açãoid actionTo = [CCMoveTo actionWithDuration: 2 p...
Talk is Cheap, show me the code ;)
Baixar Cocos2d$ git clone git://github.com/cocos2d/cocos2d-iphone.git$ cd cocos2d-iphone$ git checkout develop
Instalar Templates Cocos2dNo diretório do Cocos2d, executar o seguintescript:$ cd cocos2d-iphone/$ ./install-templates.sh
Criar um projeto Cocos2d
Arquivos Criados
Executar projeto criado
Anatomia do CCLayer (header) // When you import this file, you import all the cocos2d classes #import "cocos2d.h" // Hello...
Anatomia do CCLayer (Implementação) // Import the interfaces #import "HelloWorldLayer.h" // HelloWorldLayer implementation...
Anatomia do CCLayer (Implementação) // on "init" you need to initialize your instance -(id) init { ! // always call "super...
Alteração no Header da Layer#import "cocos2d.h"// HelloWorldLayer@interface HelloWorldLayer : CCLayer <CCTargetedTouchDele...
Criação de Sprites-(id) init{! if( (self=[super init])) {        // Cria o Sprite Troll!!    self.troll = [CCSprite sprite...
Método Trollolol- (void) trollolol {    CGSize winSize = [[CCDirector sharedDirector] winSize];    int minY = troll.conten...
Manipular o Touch- (BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event {    CGPoint touchPoint = [self convert...
Resultado
Resultado
Resultado
Resultado
Resultado
Dúvidas?
Código fontehttps://github.com/xorna/CodeRockrJam
Upcoming SlideShare
Loading in...5
×

Desenvolvimento de Jogos com Cocos2d - Apresentação Coderockr Jam

5,216

Published on

Palestra apresentada no Coderockr Jam de 2011, onde falo sobre o desenvolvimento de jogos utilizando a biblioteca open source cocos2d.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
5,216
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
107
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Desenvolvimento de Jogos com Cocos2d - Apresentação Coderockr Jam

    1. 1. Desenvolvimento de Jogos com Cocos2d André “xorna” Espeiorin
    2. 2. @xornaSócio/Programador/Eletrecista da CodeRockrProgramador LAMPProgramador iOSentre outras coisas
    3. 3. Um pouco sobre o Cocos2dOpen Source (BSD e MIT License)Relativamente Novo (stable release em 2010)Comunidade CrescenteMulti-plataformaCentenas de jogos publicadosRelativamente bem documentado
    4. 4. Versões do Cocos2dOriginal escrita em Python (multi-plataforma)Portada em Objective-C (Plataforma Apple)Portada em Java (Android)Portada em JavascriptPortada em C++ (multi-plataforma, pero nomucho)CocosNet (C#, Mono)Ruby (iOS)
    5. 5. Cocos2d para iOSVersão Atual 1.0.1Muito utilizado, desde desenvolvedores Indiesaté Zynga e AtariEngines Físicas embarcadas: Chipmunk Box2DBiblioteca de Áudio própriaBaseado em OpenGL ES 1.1
    6. 6. Cocos2d para iOSSprite SheetsSuporte a Tiled MapsSistema de PartículasRenderização de textoIntegração com o Game CenterEntre muitas outras features...
    7. 7. Toda a plataforma Apple
    8. 8. Exemplos
    9. 9. Zynga: FarmVille
    10. 10. Pro Zombie Soccer
    11. 11. Pro Zombie Soccer
    12. 12. Pro Zombie Soccer
    13. 13. Zombie Smash
    14. 14. Zombie Smash
    15. 15. Zombie Smash
    16. 16. Zombie Smash
    17. 17. Zombie Smash
    18. 18. O que preciso para começar?Ambiente de desenvolvimento Apple: Mac Mac OS X Xcode com iOS SDK Cocos2dConhecimentos: Objective-C Desenvolvimento iOS (Não precisa seravançado) Dominar os conceitos a seguir apresentados
    19. 19. Conceitos BásicosScenesDirectorLayersSprites
    20. 20. ScenesClasse CCSceneUma “Cena”, “Tela” ou “parte” do jogoApenas uma cena é apresentada por vezExemplos: Menu, Fase X, Tela de Game Over, etcCada CCScene, possui pelo menos 1 CCLayer Passar Game Intro Menu Fase 1 Fase ... Over
    21. 21. DirectorClasse CCDirector“Dirige” o gameTransições, mudança de cenaResponsável por tudo por trás das CenasResponsável pela inicialização do OpenGL ES
    22. 22. LayersClasse CCLayerÁrea “Utilizável” da CenaPodem ser usadas várias “camadas”Definem aparência e comportamento da cenaPodem conter vários tipos de objetosPodem ser transformadas assim como outrosobjetos
    23. 23. Layers (Exemplo)
    24. 24. Layers (Exemplo)
    25. 25. SpritesClasse CCSpriteImagem 2D que pode ser transformadaPode conter outros SpritesTransformações no Sprite são propagadas paratodos os objetos “filhos”
    26. 26. Touch ScreenMuito mais possibilidadesMuito mais responsabilidadesUm pouco mais de trabalho para manipulareventosO Cocos2d para iOS possui 2 tipos de eventos: Standard Touch Targeted Touch
    27. 27. Standard TouchMesmos eventos do CocoaTouchAtivado pela propriedade:self.isTouchEnabled = YES;Protocolo CCStandardTouchDelegate:@protocol CCStandardTouchDelegate <NSObject>@optional- (void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;- (void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event;- (void)ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event;- (void)ccTouchesCancelled:(NSSet *)touches withEvent:(UIEvent*)event;@end
    28. 28. Targeted TouchAo contrário do Standard, ele notifica um únicotoque por vezPara ativar as Notificações, você deve “registrar”seu objeto:[[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self priority:0 swallowsTouches:YES];}
    29. 29. Targeted Touch Delegate@protocol CCTargetedTouchDelegate <NSObject>- (BOOL)ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event;@optional// touch updates:- (void)ccTouchMoved:(UITouch *)touch withEvent:(UIEvent *)event;- (void)ccTouchEnded:(UITouch *)touch withEvent:(UIEvent *)event;- (void)ccTouchCancelled:(UITouch *)touch withEvent:(UIEvent *)event;@end
    30. 30. Qual devo usar?Standard se você precisa de manipular váriostoques simultâneosTargeted se você procura algo simples, comapenas um toque por vez
    31. 31. Ações BásicasMover elementosRotacionar elementosMostrar/Esconder elementosRedimensionar elementosTodas as ações podem ser animadas
    32. 32. Ações CompostasExecutar Ações em sequênciaExecutar várias Ações ao mesmo tempoRepetir AçõesRepetir Ações em looping
    33. 33. Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração
    34. 34. Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração linear
    35. 35. Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração linear easeInCubic
    36. 36. Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração linear easeInCubic easeOutCubic
    37. 37. Suavização de Ações (Básicas)Tornam as transições/animações mais suavesTransições com variações na aceleração linear easeInCubic easeOutCubic easeInOutCubic
    38. 38. Ações EspeciaisCallFunc / CallBlockChamar methodo após execução de uma Açãoid actionTo = [CCMoveTo actionWithDuration: 2 position: ccp(s.width-40,s.height-40)];id actionBy = [CCMoveBy actionWithDuration: 2 position: ccp(80,80)];id actionCallFunc = [CCCallFunc actionWithTarget:selfselector:@selector(doATask)]; id actionSequence = [CCSequence actions: actionTo, actionBy,actionCallFunc, nil];
    39. 39. Talk is Cheap, show me the code ;)
    40. 40. Baixar Cocos2d$ git clone git://github.com/cocos2d/cocos2d-iphone.git$ cd cocos2d-iphone$ git checkout develop
    41. 41. Instalar Templates Cocos2dNo diretório do Cocos2d, executar o seguintescript:$ cd cocos2d-iphone/$ ./install-templates.sh
    42. 42. Criar um projeto Cocos2d
    43. 43. Arquivos Criados
    44. 44. Executar projeto criado
    45. 45. Anatomia do CCLayer (header) // When you import this file, you import all the cocos2d classes #import "cocos2d.h" // HelloWorldLayer @interface HelloWorldLayer : CCLayer { } // returns a CCScene that contains the HelloWorldLayer as the only child +(CCScene *) scene; @end
    46. 46. Anatomia do CCLayer (Implementação) // Import the interfaces #import "HelloWorldLayer.h" // HelloWorldLayer implementation @implementation HelloWorldLayer +(CCScene *) scene { ! // scene is an autorelease object. ! CCScene *scene = [CCScene node]; ! ! // layer is an autorelease object. ! HelloWorldLayer *layer = [HelloWorldLayer node]; ! ! // add layer as a child to scene ! [scene addChild: layer]; ! ! // return the scene ! return scene; }
    47. 47. Anatomia do CCLayer (Implementação) // on "init" you need to initialize your instance -(id) init { ! // always call "super" init ! // Apple recommends to re-assign "self" with the "super" return value ! if( (self=[super init])) { ! ! ! ! // create and initialize a Label ! ! CCLabelTTF *label = [CCLabelTTF labelWithString:@"Hello World" fontName:@"Marker Felt" fontSize:64]; ! ! // ask director the the window size ! ! CGSize size = [[CCDirector sharedDirector] winSize]; ! ! ! // position the label on the center of the screen ! ! label.position = ccp( size.width /2 , size.height/2 ); ! ! ! ! // add the label as a child to this Layer ! ! [self addChild: label]; ! } ! return self; }
    48. 48. Alteração no Header da Layer#import "cocos2d.h"// HelloWorldLayer@interface HelloWorldLayer : CCLayer <CCTargetedTouchDelegate>{ CCSprite *troll;}@property (nonatomic, retain) CCSprite *troll;// returns a CCScene that contains the HelloWorldLayer as the only child+(CCScene *) scene;- (void) trollolol;@end
    49. 49. Criação de Sprites-(id) init{! if( (self=[super init])) { // Cria o Sprite Troll!! self.troll = [CCSprite spriteWithFile:@"Troll.png" rect:CGRectMake(0.0, 0.0,128.0, 105.0)]; // Posiciona ele em qualquer lugar [self trollolol]; // Adiciona ele a Layer [self addChild:troll]; // Registra o Targeted Touch [[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self priority:0swallowsTouches:YES];!}! return self;}
    50. 50. Método Trollolol- (void) trollolol { CGSize winSize = [[CCDirector sharedDirector] winSize]; int minY = troll.contentSize.height/2; int maxY = winSize.height - troll.contentSize.height/2; int rangeY = maxY - minY; int minX = troll.contentSize.width/2; int maxX = winSize.width - troll.contentSize.width / 2; int rangeX = maxX - minX; int actualY = (arc4random() % rangeY) + minY; int actualX = (arc4random() % rangeX) + minX; troll.position = ccp(actualX, actualY);}
    51. 51. Manipular o Touch- (BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event { CGPoint touchPoint = [self convertTouchToNodeSpace:touch]; if (CGRectContainsPoint(troll.boundingBox, touchPoint)) { [self trollolol]; return YES; } return NO;}
    52. 52. Resultado
    53. 53. Resultado
    54. 54. Resultado
    55. 55. Resultado
    56. 56. Resultado
    57. 57. Dúvidas?
    58. 58. Código fontehttps://github.com/xorna/CodeRockrJam
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×