Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Cocos2d: creare videogiochi con facilità!

999 views

Published on

Cocos2d è un framework opensource per lo sviluppo di videogiochi 2d, integra al suo interno: - animazioni, transizioni, gestione menù - gestione di sprite, textureAtlas, Tile - due motori fisici (Box2D and Chipmunk) - un sound engine - un sistema particellare Noto principalmente su iPhone (con 2500+ giochi sullo Store) è ormai presente su linguaggi e piattaforme differenti (C++, C#, java e Javascript, HTML5). Il talk presenterà tutte le principali componenti presenti su cocos2d condendo il tutto con qualche esempio pratico su piattaforma iOS.

Published in: Technology
  • Be the first to comment

Cocos2d: creare videogiochi con facilità!

  1. 1. Maurizio MoriconiCocos2d: creare videogiochi con facilità!maurizio.moriconi@mobilesoft.it - MobileSoft
  2. 2. Chi sono Maurizio Moriconi maurizio.moriconi@mobilesoft.it• CTO presso Mobilesoft • Co-founder• Mobile Developer • Main Developer http://www.linkedin.com/in/bugman @bugman79 http://www.facebook.com/maurizio.moriconi
  3. 3. Cocos2d Maurizio Moriconi maurizio.moriconi@mobilesoft.it• Framework per videogiochi 2D Open Source• Nato inizialmente in Python e portato su altri linguaggi• Versione Objective-c sviluppata da Ricardo Quesada (assunto da Zynga dal 2011)• Basato su OpenGL ES 1.1 e 2.0• Con più di 3500 giochi presenti nel solo Apple Store
  4. 4. Cocos2d portsMaurizio Moriconi maurizio.moriconi@mobilesoft.it
  5. 5. Esempi di successo Maurizio Moriconi maurizio.moriconi@mobilesoft.it• Alice (iPad)• The Elements (iPad)• Tiny Tower• StickWars• Farmville• Zombie Farm• Foldify
  6. 6. Perché usare Cocos2d Maurizio Moriconi maurizio.moriconi@mobilesoft.it • E’ gratis (no royalties) • E’ Open Source • 2D (ma usa openGL ES!) • E’ scritto in objective-C * ma meno tecnico • Si programma! • Ci fa concentrare sul gioco e sul design* o altri linguaggi di programmazione (Java, C++, C#, JavaScript, Python)
  7. 7. Materiale e comunità Maurizio Moriconi maurizio.moriconi@mobilesoft.it• Documentazione: http://www.cocos2d-iphone.org/wiki/doku.php/• Forum: http://www.cocos2d-iphone.org/forum/• API reference / Xcode Documentation integration• Tanti esempi e tool esterni (CososBuilder ed altro)• Varie pubblicazioni
  8. 8. Cocos2d Features Maurizio Moriconi maurizio.moriconi@mobilesoft.it• Scene management (workflow)• Transitions between scenes• Sprites and Sprite Sheets• Effects: Lens, Ripple, Waves, Liquid, Twirl...• Actions (behaviors): Move, Rotate, Scale, Jump...• Basic menus and buttons• Integrated physics engine: Box2d / Chipmunk• Particle systems• Text rendering support• Tile Map support: Orthogonal /Isometric / Hexagonal Map• Parallax scrolling support• Sound support• Touch/Accelerometer (iOS)  • Fast Textures: Supports PVRTC textures, 8-bit textures, 16-bit textures and 32-bit textures• Ribbons• Shaders (versione 2.0)
  9. 9. Download ed installazione Maurizio Moriconi maurizio.moriconi@mobilesoft.it http://www.cocos2d-iphone.org/downloadhttps://github.com/cocos2d/cocos2d-iphone/tagsCi sono template per Xcode!!Stable Version: 2.0 / 1.0.1Unstable Version: 2.1-rc / 1.1
  10. 10. Hello WorldMaurizio Moriconi maurizio.moriconi@mobilesoft.it
  11. 11. Hello WorldMaurizio Moriconi maurizio.moriconi@mobilesoft.it Application Delegate HelloWorld Scene Intro Scene Icone e SplashScreen Librerie cocos2d
  12. 12. Hello World Maurizio Moriconi maurizio.moriconi@mobilesoft.it Intro Scene SplashscreenHello World Scene Game Center già configurato!!!
  13. 13. Maurizio Moriconi maurizio.moriconi@mobilesoft.itShow me the code...
  14. 14. Basic Concepts Maurizio Moriconi maurizio.moriconi@mobilesoft.itDirectorinizializza OpenGL ES e gestisce le sceneScenespensiamole come una schermata di giocoLayerscompongono le scene (vedi Photoshop)Spitesvi dice qualcosa questa parola?? 8-)Nodessono l’oggetto base di cocos2d
  15. 15. Scenes Maurizio Moriconi maurizio.moriconi@mobilesoft.itCCScene Fonte immagine cocos2d Wiki• Sono composte da uno o più layer• E’ una sottoclasse di CCNode• E’ possibile avere delle transizioni CCTransitionScene
  16. 16. Layers Maurizio Moriconi maurizio.moriconi@mobilesoft.itCCLayer Fonte immagine cocos2d Wiki• Gestisce gli eventi di touches e l’accellerometro• E’ una sottoclasse di CCNode• Può essere semitrasparente• Contengono gli Sprites
  17. 17. Nodes Maurizio Moriconi maurizio.moriconi@mobilesoft.itCCNode• E’ la classe base da cui derivano le altre• Tutto quello che è disegnato è un NODO!• Possono contenere altri nodi• Eseguono Actions• Alcune proprietà Y# • Position • Z order Sperando che vi ricordate cosa sia un sistema di • Tag riferimento cartesiano • ... 0,0# X#
  18. 18. SpriteMaurizio Moriconi maurizio.moriconi@mobilesoft.it
  19. 19. Sprites Maurizio Moriconi maurizio.moriconi@mobilesoft.itCreazioneCCSprite* ryu = [CCSprite spriteWithFile:@"0.png"];Posizionamento (di base è 0,0)ryu.position = ccp( x , y );Aggiunta al Layer Sprite posizionato a 0,0[self addChild:ryu z:1 tag:123];Anchor Point di base è 0.5,0.5
  20. 20. Actions Maurizio Moriconi maurizio.moriconi@mobilesoft.itCCActions• Sono gli “ordini” che possiamo dare ai nodi!• Possono essere: istantanee o periodiche• Si auto-rimuovono una volta terminate• Si definiscono con un tempo, i movimenti o altreazioni sono interpolate e gestiti in automatico!!! es. spostati fino a x,y in 2 secondi!!!
  21. 21. Actions Maurizio Moriconi maurizio.moriconi@mobilesoft.it Basic Move, Scale, Rotate, Bezier, Hide, Fade,Tint..Composition Sequence, Repeat, Spawn, RepeatForever.. Ease Ease, EaseExponential, EaseBounce.. Effects Lens, Liquid, Ripple, Shaky,Twirl,Waves.. Special CallFunc, Follow..
  22. 22. Actions in action! Maurizio Moriconi maurizio.moriconi@mobilesoft.it CCMoveTo *moveToAction = [CCMoveTo actionWithDuration:duration position:newPosition]; [ryu runAction:moveToAction];CCScaleTo *scaleToAction = [CCScaleTo actionWithDuration:duration scale:scale];CCRotateBy *rotateByAction = [CCRotateBy actionWithDuration:duration angle:angle];CCSequence *sequence = [CCSequence actions:scaleToAction, rotateByAction, nil];[ryu runAction:sequence];
  23. 23. Maurizio Moriconi maurizio.moriconi@mobilesoft.itShow me the code...
  24. 24. Sprite SheetsMaurizio Moriconi maurizio.moriconi@mobilesoft.it Super Mario All-Stars: Super Mario Bros. 2
  25. 25. Texture Atlas Maurizio Moriconi maurizio.moriconi@mobilesoft.it Texture con dimensioni di potenze di 2 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048 Wasted memory Perchè usarle ???1. Chiamate ad OpenGLES ridotte2. Utilizzo della memoria ottimizzato3. Si possono gestire sprite con diverse dimensioni4. Ci sono tool ottimi come Texture Packer (o Zwoptex) per crearle Texture 256x256
  26. 26. Texture Packer Maurizio Moriconi maurizio.moriconi@mobilesoft.ithttp://www.codeandweb.com/texturepacker
  27. 27. Gestire i controlli Maurizio Moriconi maurizio.moriconi@mobilesoft.it - (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;• Ogni layer può ricevere comandi (touch, mouse, tastiera)• Facile da implementare!!!• Implementazioni di Joypad OpenSource
  28. 28. Maurizio Moriconi maurizio.moriconi@mobilesoft.itShow me the code...
  29. 29. Physics engine Maurizio Moriconi maurizio.moriconi@mobilesoft.it Con un motore fisico si delega la gestione delleanimazioni mappando Sprite con oggetti della fisicaScelta tra 2 motori Fisici: • Box2D • ChipMunk
  30. 30. Box2d Maurizio Moriconi maurizio.moriconi@mobilesoft.itCaratteristiche: • scritto in C++ • sviluppato da Erin Catto (Blizzard Entertainment) • openSource e multipiattaforma http://box2d.org
  31. 31. ChipMunk Maurizio Moriconi maurizio.moriconi@mobilesoft.itCaratteristiche: • scritto in C • sviluppato da Scott Lembcke (Howling Moon Software) • openSource e multipiattaforma • esistono versioni a pagamento http://chipmunk-physics.net
  32. 32. Cocos2d TemplatesMaurizio Moriconi maurizio.moriconi@mobilesoft.it
  33. 33. Sound Engine Maurizio Moriconi maurizio.moriconi@mobilesoft.itCocosDenshion• Libreria audio iOS e Mac OS X• Si può usare al di fuori di Cocos2d!!• Alto e basso livello• Supporta molti formati tra cui: • Caf • Aiff • Wav • Mp3
  34. 34. SimpleAudioEngine Maurizio Moriconi maurizio.moriconi@mobilesoft.itPlay a sound [[SimpleAudioEngine sharedEngine] playEffect:@"mysound.wav"];Play a music [[SimpleAudioEngine sharedEngine] playBackgroundMusic:@"mario-music.mp3"];Preload a sound [[SimpleAudioEngine sharedEngine] preloadEffect:@"mysound.wav"];Preload a music [[SimpleAudioEngine sharedEngine] preloadBackgroundMusic:@"mario-music.mp3"];
  35. 35. CDAudioManager e CDSoundEngine Maurizio Moriconi maurizio.moriconi@mobilesoft.itCDAudioManager• E’ usata anche da SimpleAudioEngine• Permette di gestire più tracce di lunga durata• Utile se serve suonare più suoni contemporaneamenteCDSoundEngine• Sound Engine basato su OpenAL• Gestisce fino a 32 suoni contemporanei• Permette effetti come: • Pitch • Pan • Gain
  36. 36. Alcune features Maurizio Moriconi maurizio.moriconi@mobilesoft.itIl tempo è tiranno...Vediamo alcune features al volo...
  37. 37. Menu Maurizio Moriconi maurizio.moriconi@mobilesoft.itCCMenucomposto da Menu Item
  38. 38. Particle system Maurizio Moriconi maurizio.moriconi@mobilesoft.itSistema particellare, alcuni effetti: • fuoco • pioggia • neve • galassia • molti altri....CCParticleFire *fire = [[CCParticleFire alloc] initWithTotalParticles:100];[fire setLife:20];[fire setAutoRemoveOnFinish:YES];fire.position = ccp(size.width/4,size.height/2);[self addChild:fire];
  39. 39. Tile maps Maurizio Moriconi maurizio.moriconi@mobilesoft.itBasate sul concetto di Tile• riuso della grafica• possibilità di assegnare status a dei tile• editor esterni per creare “mondi” Ortogonali Isometriche
  40. 40. Altre ancora... Maurizio Moriconi maurizio.moriconi@mobilesoft.itParallax Scrolling BitMapped Font Ribbons Cocos Builder Shaders Game Center
  41. 41. Cocos2d Maurizio Moriconi maurizio.moriconi@mobilesoft.itCocos2d è uno dei tanti mezzi... il resto ce lo mettete voi...
  42. 42. Programmare è un arte! Maurizio Moriconi maurizio.moriconi@mobilesoft.itOur discussion indicates that computerprogramming is by now both a scienceand an art, and that the two aspectsnicely complement each other.[...] We have seen that computerprogramming is an art, because itapplies accumulated knowledge to theworld, because it requires skill andingenuity, and especially because itproduces objects of beauty. Aprogrammer who subconsciously viewshimself as an artist will enjoy what hedoes and will do it better. Therefore wecan be glad that people who lecture atcomputer conferences speak aboutthe state of the Art. Donald Knuth“The Art of Computer Programming”

×