{"_id":"54667e7af2b6390800dfd82a","is_link":false,"user":"54639d06447e0a1000249f7f","version":{"_id":"5463e333447e0a100024a08a","project":"5463e333447e0a100024a087","__v":6,"createdAt":"2014-11-12T22:46:11.486Z","releaseDate":"2014-11-12T22:46:11.486Z","categories":["5463e333447e0a100024a08b","54645c365871e90800f50151","547b1c5a4366a708001b3b50","547b1cdf4366a708001b3b5a","54e3bef8464a9c3700f7ca67","54ec651d7ab3172d00c01ab7"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"category":{"_id":"5463e333447e0a100024a08b","project":"5463e333447e0a100024a087","pages":["5463e334447e0a100024a08d","54646a285871e90800f50174","54667e7af2b6390800dfd82a","54679c8c98b6840800268982","54679d8498b6840800268987","546a2ed0394c861a00c3a413","546b6a4862515a14007ebbba","547b1c2e7eec0f080099e1dd","55d33d90b9ef4435006dec70","56570c764d1c720d001f51bb"],"version":"5463e333447e0a100024a08a","__v":10,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2014-11-12T22:46:11.951Z","from_sync":false,"order":1,"slug":"documentation","title":"Documentation"},"project":"5463e333447e0a100024a087","__v":33,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2014-11-14T22:13:14.564Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"basic_auth":false,"results":{"codes":[]},"try":true,"auth":"never","params":[],"url":""},"isReference":false,"order":2,"body":"##**Core Components**\n\nThe core components of Cocos are **Scenes**, **Nodes** and **Actions**.\n\n**Scenes** essentially provide a means of grouping and displaying items (nodes in the case of Cocos) on a screen. For example a game would have many scenes such as:\n  * Main menu scene\n  * Level select scene\n  * Game scene\n  * Pause scene\n  * Settings scene\n\nThese are useful as they allow you as the developer to isolate sections of the game and provide a means for switching between them. Not only is this very efficient in terms of computing power but also helps maintain good code.\n\nScenes work using LIFO (Last In First Out). Scenes will be discussed in more depth later in this guide.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/iBWPkhgkTrCHT1K6Uv9a_2000px-Data_stack.svg.png\",\n        \"2000px-Data_stack.svg.png\",\n        \"2000\",\n        \"1437\",\n        \"#0404fc\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n**Nodes** are the items that you would place in a scene. A scene can be thought of as the container and nodes are the objects/items that are placed inside the container which the player would see and interact with. Even scenes are nodes.\n\nPretty much everything from Sprites to Menu Items to Labels to Sliders are nodes. Nodes have a set of methods from scaling to positioning allowing you to easily create your scene containing nodes.\n\n**Actions** provide various means for manipulating a node's properties. For example if there was a *Sprite Node* in the game, an action could be applied to make it move from one side of the screen to the other. Most of the actions take various parameters from duration of the animation to how the animation should perform.\n\nMost of the actions have *To* and *By* versions. Let's go over what each version essentially does.\n\nThe *To* actions manipulate the node's properties absolutely and doesn't take the node's current properties into account. For example, if a sprite was at position (200, 100) and a move to action was applied of (50, 0) then the sprite's new position would be at (50, 0).\n\nThe *By* actions manipulate the node's properties relative to it's current state. For example, if a sprite was at position (200, 100) and a move by action was applied of (50, 0) then the sprite's new position would be at (250, 100).\n\nEach action will be covered in more depth later in this guide.\n\n##**Director**\n\nThe director is used to control the flow of the game. It handles the scenes and allow each component in your game to communicate with other components allowing a game to navigate from one scene to another.\n\nThe director is a singleton object which is shared hence it doesn't need to be initialised.","excerpt":"This page will discuss the basics of Cocos and how they come together to form the game engine.","slug":"cocos-basics","type":"basic","title":"Cocos Basics"}

Cocos Basics

This page will discuss the basics of Cocos and how they come together to form the game engine.

##**Core Components** The core components of Cocos are **Scenes**, **Nodes** and **Actions**. **Scenes** essentially provide a means of grouping and displaying items (nodes in the case of Cocos) on a screen. For example a game would have many scenes such as: * Main menu scene * Level select scene * Game scene * Pause scene * Settings scene These are useful as they allow you as the developer to isolate sections of the game and provide a means for switching between them. Not only is this very efficient in terms of computing power but also helps maintain good code. Scenes work using LIFO (Last In First Out). Scenes will be discussed in more depth later in this guide. [block:image] { "images": [ { "image": [ "https://files.readme.io/iBWPkhgkTrCHT1K6Uv9a_2000px-Data_stack.svg.png", "2000px-Data_stack.svg.png", "2000", "1437", "#0404fc", "" ] } ] } [/block] **Nodes** are the items that you would place in a scene. A scene can be thought of as the container and nodes are the objects/items that are placed inside the container which the player would see and interact with. Even scenes are nodes. Pretty much everything from Sprites to Menu Items to Labels to Sliders are nodes. Nodes have a set of methods from scaling to positioning allowing you to easily create your scene containing nodes. **Actions** provide various means for manipulating a node's properties. For example if there was a *Sprite Node* in the game, an action could be applied to make it move from one side of the screen to the other. Most of the actions take various parameters from duration of the animation to how the animation should perform. Most of the actions have *To* and *By* versions. Let's go over what each version essentially does. The *To* actions manipulate the node's properties absolutely and doesn't take the node's current properties into account. For example, if a sprite was at position (200, 100) and a move to action was applied of (50, 0) then the sprite's new position would be at (50, 0). The *By* actions manipulate the node's properties relative to it's current state. For example, if a sprite was at position (200, 100) and a move by action was applied of (50, 0) then the sprite's new position would be at (250, 100). Each action will be covered in more depth later in this guide. ##**Director** The director is used to control the flow of the game. It handles the scenes and allow each component in your game to communicate with other components allowing a game to navigate from one scene to another. The director is a singleton object which is shared hence it doesn't need to be initialised.