Build a Game in 60 minutes
1 like646 views
Cocos2d-x is an open-source game engine optimized for 2D graphics, used by over 400,000 developers globally. It supports multiple platforms including Android, iOS, Mac OS X, and Windows, and uses languages such as C++, Lua, and JavaScript. The engine provides various features like physics simulation, audio support, and a game loop, making it suitable for a wide range of game development projects.
Build a Game in 60 minutes
- 1. Build a Game in 60 minutes PeopleSpace, Irvine CA 24 May 2016
- 4. Troy Miles Troy Miles Over 37 years of programming experience Speaker and author Author of jQuery Essentials rockncoder@gmail.com @therockncoder
- 7. What is Cocos2d-x? Open source game engine under MIT license It is optimized for 2D graphics using OpenGL Used by more than 400,000 developers worldwide
- 8. History 2008 Ricardo Quesada in Argentina creates Cocos2d Ported to iPhone with the opening of the iPhone App Store 2010 Zhe Wang in China forks it creating Cocos2d-x 2013 Ricardo joins Cocos2d-x team 12 May 2016 version 3.11 released
- 9. Target Platforms Android iOS (iPhone + iPad) Mac OS X Windows Phone 8 Windows 7
- 10. Development Platforms Visual Studio 2012+ (Windows) Xcode 4.6+ (Mac) CMake 2.6+ (Ubuntu) All platforms need Python v2.7.x (not 3!)
- 11. Development Languages C++ Lua JavaScript (all except WP8)
- 12. Why JavaScript? Arguably the most popular programming language It is universal It is fast Way easier to learn than C++
- 13. Mandatory Tools iOS / Mac OS X apps require Xcode and a Mac Windows / WP8 apps require VS and a PC
- 16. Text Family Guy: The Quest for Stuff TinyCo, Inc.
- 19. BADLAND Frogmind
- 21. Key Points Cocos2d has been around since 2008 Cocos2d-x uses C++ for speed A lot of big name titles use it It has always been free and always will be
- 23. Keep in mind… I am using a Mac, but Cocos2D-x is cross platform Everything will work on Windows and Linux
- 24. Mac Development Python 2.7.x Apple Xcode (Jetbrains’ AppCode)
- 25. Windows Development Python 2.7.x Visual Studio 2012+ Windows Phone SDK 8
- 27. Download http://www.cocos2d-x.org/download Under the column, Cocos2d-x, Click, “DOWNLOAD V3.11” Unzip it
- 28. Installation From terminal or command prompt cd to the root of the directory setup.py (will modify your path and other env variables) open the project for your environment
- 29. Key Points Installing cocos2d-x is pretty easy Everything is done from the command line
- 32. JavaScript Uses Mozilla’s SpiderMonkey JS Engine v33 Released 14 Oct 2014 Same engine used in FireFox 33 Support a lot of ES6 features (except templates strings)
- 34. Audio Sound effects Background music CocosDenshion library (Open AL) Support audio is platform dependent
- 35. Physics Chipmunk2D Portable 2-dimensional real-time rigid body physics engine Written in C99 by Scott Lembcke Box2d Free open source 2-dimensional physics simulator engine Written in C++ by Erin Catto Published under the zlib license
- 36. Network HTTP + SSL WebSocket API XMLHttpRequest API
- 37. User Input Touch/Accelerometer on mobile devices Touch/Mouse/Keyboard on desktop Game controller support
- 38. 2D Graphics Transitions between scenes Sprites and Sprite Sheets Effects: Lens, Ripple, Waves, Liquid, etc. Transformation Actions: Move, Rotate, Scale, Fade, Tint, etc. Composable actions: Sequence, Spawn, Repeat, Reverse
- 39. 2D Graphics Ease Actions: Exp, Sin, Cubic, Elastic, etc. Misc actions: CallFunc, OrbitCamera, Follow, Tween Particle system Skeleton Animations: Spine and Adobe DragonBone Fast font rendering using Fixed and Variable width fonts
- 40. 2D Graphics TrueType fonts Tile Map support: Orthogonal, Isometric and Hexagonal Parallax scrolling Motion Streak Render To Texture
- 41. Right handed coordinate system Different than web Origin (0,0) located at lower left hand of screen x position increases going right y position increases going up max x,y at upper right hand corner
- 42. Let’s make a game
- 43. Cocos command options new - creates a new game run - compile, deploy, and run on game on target deploy - deploy game to target compile - compiles game luacompile - minifies Lua files and compiles jscompile - minifies JS files and compiles
- 44. Cocos command options -h, —help - Shows the help -v, —version - Shows the current version
- 45. Creating a new game Open the cmd window Validate that cocos is in your path, cocos <enter> cocos new gamename -p com.company.name -l js
- 46. new command explained MyGame: name of your project -p com.mycompany.mygame: package name -l js: programming language used for the project, valid values are: cpp, lua, and js
- 48. Class Directory AppDelegate initializes cocos2d-x HelloWorldScene is where your game begins
- 49. Hello World Cocos2D-x ships as source code Build it to compile the libraries
- 50. Bootup on Mac launches from main.cpp calls AppDelegate.cpp (starts up Cocos2D-x) calls main.js (launches your scene)
- 51. Graphics Diagnostics configured in project.json 82 <-- number of draw calls 0.016 <-- time it took to render the frame 60.0 <-- frames per second
- 52. Don’t forget Add JavaScript files to the project.json Add resources (images/sound/music) to resources.js Forgetting to add them is a very common bug
- 54. Adding Scenes Scenes are actually derived from the Layer class Add scene for main, game, pause, end game Add colors to scenes Add transitions
- 55. The Game Loop The central component of any game Allows game to run smoothly regardless of user input Allows game to run at same speed regardless of machine
- 56. Game Loop Reality In the scene init add, this.scheduleUpdate() Add an update method, HelloWorld::update(float dt) The update method should be as fast as possible
- 57. Steps Add a background Add a hero Move the hero Detect touches Fire bullets Add enemy Animate enemy Detect collision Give points Detect end of game
- 58. Steps Adding sound Adding music Adding scenes
- 62. Summary Cocos2d-x is a free open source game engine It supports Android, iOS, Windows and Mac
- 63. Questions?