• Like

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Introduction to Cocos2d

  • 7,292 views
Uploaded on

The talk I gave at 360iDev Austin in November, 2010 on Cocos2D development for iOS.

The talk I gave at 360iDev Austin in November, 2010 on Cocos2D development for iOS.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • how do you get to the examples?
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
7,292
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
269
Comments
1
Likes
12

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Introduction to Cocos2d: Learning from Examples Thomas V. Frauenhofer Beret Applications LLC 360iDev Austin, November, 2010 Monday, November 8, 2010
  • 2. Who am I? • Software developer for 28+ years • IBM’er by day, mobile developer at night • 10 years in Palm OS mobile development • (May it rest in peace) Monday, November 8, 2010
  • 3. Chromatic Cosmos • Cocos2d-Based Tower defense game released last August • FREE on iTunes this week! http://beret.com Monday, November 8, 2010
  • 4. Overview • Motivation - Why Cocos2D? • Definition of simple project (BlockGame) • Building the project • We won’t finish, but you’ll get all the code Monday, November 8, 2010
  • 5. Why Cocos2D? Monday, November 8, 2010
  • 6. Why Cocos2D? • Simple 2D Gaming SDK • Built upon the OpenGL API’s • Rich Objective-C API • Used in thousands of apps • Very active developer community Monday, November 8, 2010
  • 7. Even more Why Cocos2D • Integrates with some very useful libraries • Physics (Chimpunk, Box2D) • Sound (CocosDension) • Game boards (cocoslive) • And others... Monday, November 8, 2010
  • 8. Things to Consider • Cocos2D is an open-source project • Read the licenses carefully • Cocos2D has changed A LOT over the past year • Support for newer iOS versions/features • Changes in names and abstractions used • Adopting a new version may be a significant amount of work Monday, November 8, 2010
  • 9. A brief overview of Cocos2D Monday, November 8, 2010
  • 10. High-level Cocos2d • The Director (CCDirector) is the boss • Manages the window and the scenes • Manages the interactions with the underlying OpenGL environment • A game has one or more scenes (CCScene) • Think of a scene in the thematic sense Monday, November 8, 2010
  • 11. Sample Scene workflow source: http://www.cocos2d-iphone.org/wiki/doku.php/prog_guide:basic_concepts Monday, November 8, 2010
  • 12. It all started with a (CC)Node... • CCNode is the base class of (almost) all Cocos2D classes • Many attributes are defined • Position • Size • z-order • etc... Monday, November 8, 2010
  • 13. A quick note on coordinates • The origin is the lower left-hand corner of the screen • The position of an object is the center of the object image source: http://www.anima-entertainment.de Monday, November 8, 2010
  • 14. Layers in Cocos2d source: http://www.cocos2d-iphone.org/wiki/doku.php/prog_guide:basic_concepts Monday, November 8, 2010
  • 15. Layers • A layer (CCLayer) is where a user interacts with Cocos2d objects • A layer handles touch and accelerometer events • A layer contains other layers and sprites Monday, November 8, 2010
  • 16. Sprites • A sprite (CCSprite) is an active object in your game • 2 dimensional object • Has an image (not generated) • Can be animated, touched, moved, etc. Monday, November 8, 2010
  • 17. Animated Sprites • Use of Batch Sprites/Sprite Sheets/Atlas Sprites (versus individual image files) • Depending on your version/history with Cocos2d • Uses OpenGL Texture Atlas to provide higher animation performance Monday, November 8, 2010
  • 18. Actions and Animation • You animate a sprite using the CCAnimation class • You make a sprite move using derivatives of the CCAction class • You can specify sequences of actions (CCSequence) and actions done in parallel (CCSpawn) Monday, November 8, 2010
  • 19. Block Game - a simple game to introduce you to Cocos2d Monday, November 8, 2010
  • 20. Commentary • It is important to know what you are building before you build it... • Design, look, interaction • Cheaper and faster to design than to code • ...but don’t go overboard • Avoid “analysis paralysis” • Iterate - design, code, test, rinse, repeat Monday, November 8, 2010
  • 21. In short... • Make it work • Next, make it good • Next, make it GREAT! Monday, November 8, 2010
  • 22. Block Game • Teach you about: • Sprites • Actions • Collision detection Monday, November 8, 2010
  • 23. Game Elements Piece user drags to remove... ...one of the boxes moving across the bottom of the screen... Monday, November 8, 2010
  • 24. Game Elements ...while avoiding the blockers who are protecting the boxes Monday, November 8, 2010
  • 25. Additional Notes • Single-color background • I chose yellow, but you could pick another color • You can use either color squares or dice images for UserSprite/boxes • Both are included in basic sample project • Using Cocos2d version 0.99.5 beta 3 Monday, November 8, 2010
  • 26. Game Items • The piece the user moves around is a sprite (UserSprite) • The boxes are sprites (BoxSprite) • Blockers that move back and forth above and below the conveyor belt Monday, November 8, 2010
  • 27. Game Actions • Touch and move UserSprite • Boxes just move right-to-left • New boxes are periodically added on right • Blockers move back and forth • UserSprite can collide with boxes and blockers Monday, November 8, 2010
  • 28. Miscellanous • Using XCode 3.2.5 • Using cocos2d-iphone-0.99.5-beta3 • Requires iOS 4.0+ (4.2 for iPad versions) Monday, November 8, 2010
  • 29. Building the project Monday, November 8, 2010
  • 30. Setting the scene • Set orientation to portrait (Example 01) • Set background color yellow (Example 02) Monday, November 8, 2010
  • 31. Add the UserSprite • Example 03 Monday, November 8, 2010
  • 32. Make UserSprite move • Example 04 Monday, November 8, 2010
  • 33. Add the Boxes • Example 05 Monday, November 8, 2010
  • 34. Collisions between UserSprite and Boxes • Example 06 Monday, November 8, 2010
  • 35. Add the Blockers • Example 07 Monday, November 8, 2010
  • 36. Miscellaneous changes • Random start values - Example 08 • CocosDension (Sound) - Example 09 • iPad support - Example 10 Monday, November 8, 2010
  • 37. Miscellaneous Monday, November 8, 2010
  • 38. For more information • http://cocos2d-iphone.org - Cocos2d for iOS information • New book: Learn iPhone and iPad Cocos2D Game Development (Apress) • Previous 360iDev Presentations, including: • “Introduction to 2d Game Programming Using cocos2d” (360iDev Denver 2009) • “Cocos2D + Box2D” (360iDev San Jose) • Blogs (Ray Wenderlich’s is especially good) Monday, November 8, 2010
  • 39. From this presentation • Slides: • http://dl.dropbox.com/u/5375467/Introduction%20to%20Cocos2d.key • http://dl.dropbox.com/u/5375467/Introduction%20to%20Cocos2d.pdf • Sample code: • http://dl.dropbox.com/u/5375467/IntroToCocos2DSamples.zip Monday, November 8, 2010
  • 40. My Contact Information • Email: tvf@beret.com • Our company: http://beret.com • Web: http://tomfrauenhofer.com • Twitter: @tvf Monday, November 8, 2010
  • 41. Thank you! (and don’t forget the Game Jam!) http://gamejam.360idev.com Monday, November 8, 2010