{"_id":"546b6a4862515a14007ebbba","project":"5463e333447e0a100024a087","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"},"user":"54639d06447e0a1000249f7f","__v":45,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2014-11-18T15:48:24.346Z","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":5,"body":"Pretty much everything in Cocos derives from nodes such as scenes and sprites. Cocos provides nodes with common functionality such as position, scale, z-index, rotation plus much more.\n\nWhat this essentially means is that most of the objects you will add have similar functions hence they will be covered on this page.\n\n##**Local Z-index** - z-order relative to its siblings in the scene\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"/*\\nsets the local z-index (must by an integer)\\nnodes with a higher z-index appear above nodes with lower z-index's\\n*/\\nnodeName->setLocalZOrder( 5 );\\n\\n// gets the local z-index value (returns an integer)\\nnodeName->getLocalZOrder( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"/*\\nsets the local z-index (must by an Number)\\nnodes with a higher local z-index appear above nodes with lower z-index's\\n*/\\nnodeName.setLocalZOrder( 5 );\\n\\n// gets the local z-index value (returns a Number)\\nnodeName.getLocalZOrder( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Global Z-index** - defines the order in which the nodes are rendered\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"/*\\nsets the global z-index (must by an float)\\nnodes with a lower global z-index are rendered first\\n*/\\nnodeName->setGlobalZOrder( 5.0 );\\n\\n// gets the global z-index value (returns an integer)\\nnodeName->getGlobalZOrder( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"/*\\nsets the global z-index (must by a Number)\\nnodes with a lower global z-index are rendered first\\n*/\\nnodeName.setGlobalZOrder( 5 );\\n\\n// gets the global z-index value (returns a Number)\\nnodeName.getGlobalZOrder( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Scale** - scaling factor of the node and its children\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// scaling factor that multiplies the width of the node and its children (takes a float)\\nnodeName->setScaleX( 0.5 );\\n\\n// returns the scale factor in the x-axis (returns a float)\\nnodeName->getScaleX( );\\n\\n// scaling factor that multiplies the height of the node and its children (takes a float)\\nnodeName->setScaleY( 0.5 );\\n\\n// returns the scale factor in the y-axis (returns a float)\\nnodeName->getScaleY( );\\n\\n// scaling factor that multiplies the z-axis of the node and its children (takes a float)\\nnodeName->setScaleZ( 0.5 );\\n\\n// returns the scale factor in the z-axis (returns a float)\\nnodeName->getScaleZ( );\\n\\n// scales the node in the x, y and z axis (take a float)\\nnodeName->setScale( 0.5 );\\n\\n// returns the scale factor for the x and y axis if they are the same (returns a float)\\nnodeName->getScale( );\\n\\n// scales the node's height and width (takes 2 floats)\\nnodeName->setScale( 0.5, 0.2 );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// scaling factor that multiplies the width of the node and its children (takes a Number)\\nnodeName.setScaleX( 0.5 );\\n\\n// returns the scale factor in the x-axis (returns a Number)\\nnodeName.getScaleX( );\\n\\n// scaling factor that multiplies the height of the node and its children (takes a Number)\\nnodeName.setScaleY( 0.5 );\\n\\n// returns the scale factor in the y-axis (returns a Number)\\nnodeName.getScaleY( );\\n\\n// scaling factor that multiplies the z-axis of the node and its children (takes a Number)\\nnodeName.setScaleZ( 0.5 );\\n\\n// returns the scale factor in the z-axis (returns a Number)\\nnodeName.getScaleZ( );\\n\\n// scales the node in the x, y and z axis (take a Number)\\nnodeName.setScale( 0.5 );\\n\\n// returns the scale factor for the x and y axis if they are the same (returns a Number)\\nnodeName.getScale( );\\n\\n// scales the node's height and width (takes 2 Numbers)\\nnodeName.setScale( 0.5, 0.2 );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nNote: *Default scale value is 1*\nWarning: *Physics body doesn't support this*\n\n##**Position** - position of the node\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's position using a Vec2\\nnodeName->setPosition( Vec2( 50.0, 100.0 ) );\\n\\n// get the node's position (returns a Vec2 &)\\nnodeName->getPosition( );\\n\\n// get node position result x and y\\nresult.x;\\nresult.y;\\n\\n// set the node's position using normalized coordinates (between 0 and 1)\\nnodeName->setNormalizedPosition( Vec2( 0.5, 0.7l ) );\\n\\n// get the node's position using normalized coordinates\\nnodeName->getNormalizedPosition( );\\n\\n// get node's normalized position result x and y\\nnormalizedResult.x;\\nnormalizedResult.y;\\n\\n// set the node's position using 2 float values\\nnodeName->setPosition( 50.0, 100.0 );\\n\\n// get the node's position but takes 2 float * paramaters instead of returning a value, the x and y positions are assigned to the parameters\\nfloat *x, *y;\\nsprite->getPosition( x, y );\\n\\n// set the node's x and y positions individually (takes a float)\\nnodeName->setPositionX( 50.0 );\\nnodeName->setPositionY( 50.0 );\\n\\n// get the node's x and y positions individually (returns a float)\\nnodeName->getPositionX( );\\nnodeName->getPositionY( );\\n\\n// set the node's position but in 3D space using a Vec3\\nnodeName->setPosition( Vec3( 100.0, 200.0, 50.0 ) );\\n\\n// get the node's 3D position (returns a Vec3)\\nnodeName->getPosition3D( );\\n\\n// get node's position result x, y and z\\nresult3D.x;\\nresult3D.y;\\nresult3D.y;\\n\\n// set the node's z position using a float value\\nnodeName->setPositionZ( 50.0 );\\n\\n// get the node's z position (returns a float)\\nnodeName->getPositionZ( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's position\\nnodeName.setPosition( cc.p( 50, 100 ) );\\n\\n// get the node's position (returns a cc.Point)\\nnodeName.getPosition( );\\n\\n// get node position result x and y\\nresult.x;\\nresult.y;\\n\\n// set the node's position using 2 Numbers\\nnodeName.setPosition( 50.0, 100.0 );\\n\\n// set the node's x and y positions individually (takes a Number)\\nnodeName.setPositionX( 50.0 );\\nnodeName.setPositionY( 50.0 );\\n\\n// get the node's x and y positions individually (returns a Number)\\nnodeName.getPositionX( );\\nnodeName.getPositionY( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Skewing** - distorts/stretches the node by skewing the angles in degrees\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// skew the node's angles (takes a float value)\\nnodeName->setSkewX( 10.0 );\\nnodeName->setSkewY( 10.0 );\\n\\n// get the node's skew angles (returns a float value)\\nnodeName->getSkewX( );\\nnodeName->getSkewY( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// skew the node's angles (takes a Number)\\nnodeName.setSkewX( 10.0 );\\nnodeName.setSkewY( 10.0 );\\n\\n// get the node's skew angles (returns a Number)\\nnodeName.getSkewX( );\\nnodeName.getSkewY( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nWarning: *Physics body doesn't support this*\n\n##**Anchor Point** - anchorPoint is the point around which all transformations and positioning manipulations take place essentially like a pin\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's anchor point using a Vec2 &\\nnodeName->setAnchorPoint( Vec2( 0.5, 0.5 ) );\\n\\n// get the node's anchor point (returns a Vec2 &)\\nnodeName->getAnchorPoint( );\\n\\n// get the node's anchor point in pixels (returns a Vec2 &)\\nnodeName->getAnchorPointInPoints( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's anchor point using a cc.p\\nnodeName.setAnchorPoint( cc.p( 0.5, 0.5 ) );\\n\\n// get the node's anchor point (returns a cc.Point)\\nnodeName.getAnchorPoint( );\\n\\n// get the node's anchor point in pixels (returns a cc.Point)\\nnodeName.getAnchorPointInPoints( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nWarning: *If node has a physics body, the anchor point must be in the middle, you can't change this to another value.*\n\n##**Content Size** - sets the untransformed size of the node\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's content size (takes a Size & parameter)\\nnodeName->setContentSize( Size( 30.0, 90.0 ) );\\n\\n// get the node's content size (returns a Size &)\\nnodeName->getContentSize( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's content size (takes a cc.size parameter)\\nnodeName.setContentSize( cc.size( 30.0, 90.0 ) );\\n\\n// get the node's content size (returns a cc.size)\\nnodeName.getContentSize( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Visibility** - sets whether or not the node is visible\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's visibility (takes a bool, true is visible and false is invisible)\\nnodeName->setVisible( true );\\n\\n// get the node's visibility status (returns a bool)\\nnodeName->isVisible( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's visibility (takes a Boolean, true is visible and false is invisible)\\nnodeName.setVisible( true );\\n\\n// get the node's visibility status (returns a Boolean)\\nnodeName.isVisible( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Rotation** - sets the rotation (angle) of the node in degrees\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's rotation (takes a float value)\\nnodeName->setRotation( 45.0 );\\n\\n// get the node's rotation (returns a float value)\\nnodeName->getRotation( );\\n\\n// set 3D rotation (takes a Vec3 &)\\nnodeName->setRotation3D( Vec3( 45.0, 125.0, 20.0 ) );\\n\\n// get the 3D rotation (returns a Vec3 &)\\nnodeName->getRotation3D( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's rotation (takes a Number)\\nnodeName.setRotation( 45.0 );\\n\\n// get the node's rotation (returns a Number)\\nnodeName.getRotation( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nNote: *0 is the default rotation angle.*\n\nNote: *Positive values rotate node clockwise, and negative values for anti-clockwise.*\n\n##**Skew Rotation** - to be used in conjunction with skewing\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's skew rotation angles (takes a float)\\nnodeName->setRotationSkewX( 40.0 );\\nnodeName->setRotationSkewY( 60.0 );\\n\\n// get the node's skew rotation angles (returns a float)\\nnodeName->getRotationSkewX( );\\nnodeName->getRotationSkewY( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's skew rotation angles (takes a Number)\\nnodeName.setRotationX( 40.0 );\\nnodeName.setRotationY( 60.0 );\\n\\n// get the node's skew rotation angles (returns a Number)\\nnodeName.getRotationX( );\\nnodeName.getRotationY( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Tag and Name** - used to identify a node\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's tag (takes an integer)\\nnodeName->setTag( 5 );\\n\\n// get the node's tag (returns an integer)\\nnodeName->getTag( );\\n\\n// set the node's name (takes a String)\\nnodeName->setName( \\\"Name\\\" );\\n\\n// get the node's tag (returns a String)\\nnodeName->getName( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's tag (takes a Number)\\nnodeName.setTag( 5 );\\n\\n// get the node's tag (returns a Number)\\nnodeName.getTag( );\\n\\n// set the node's name (takes a String)\\nnodeName.setName( \\\"Name\\\" );\\n\\n// get the node's name (returns a String)\\nnodeName.getName( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Node's Scene** - get the node that the scene belongs to\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// returns the node that the Scene belongs to\\n// if the node doesn't belong to any scene then 'nullptr' is returned\\nnodeName->getScene( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// no JavaScript equivalent\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Bounding Box** - rectangular box that contains the node\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// get the node's bounding box (returns a Rect)\\nnodeName->getBoundingBox( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// get the node's bounding box (returns a cc.Rect)\\nnodeName.getBoundingBox( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\n##**Actions** - actions allow a node's properties to be manipulated\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// run an Action (plus return the Action that is executed)\\nnodeName->runAction( actionToRun );\\n\\n// stops all the running actions\\nnodeName->stopAllActions( );\\n\\n// stop a particular action\\nnodeName->stopAction( actionToStop );\\n\\n// stop an action based on it's tag (takes an integer)\\nnodeName->stopActionByTag( 5 );\\n\\n// retrieves a running action based on it's tag (returns an integer)\\nnodeName->getActionByTag( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// run an cc.Action (plus return the cc.Action that is executed)\\nnodeName.runAction( actionToRun );\\n\\n// stops all the running actions\\nnodeName.stopAllActions( );\\n\\n// stop a particular cc.Action\\nnodeName.stopAction( actionToStop );\\n\\n// stop an cc.Action based on it's tag (takes a Number)\\nnodeName.stopActionByTag( 5 );\\n\\n// retrieves a running cc.Action based on it's tag (returns a Number)\\nnodeName.getActionByTag( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nNote: *Every action will be covered in a separate section.*\n\n##**Physics Body** - physics body allow collisions to take place\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the physics body for the node (takes a PhysicsBody *)\\nnodeName->setPhysicsBody( physicsBody );\\n\\n// get the node's physics body (returns a PhysicsBody *)\\nnodeName->getPhysicsBody( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    }\n  ]\n}\n[/block]\n##**Opacity And Colour** - the visibility and colour of the node\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// set the node's opacity (takes a GLubyte ranging between 0 and 255, 0 being invisible and 255 fully visible)\\nnodeName->setOpacity( 100 );\\n\\n// get the node's opacity (returns a GLubyte)\\nnodeName->getOpacity( );\\n\\n// set the node's colour (takes a Color3B)\\nnodeName->setColor( color3BObject );\\n\\n// get the node's colour (returns a Color3B)\\nnodeName->getColor( );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// set the node's opacity (takes a Number ranging between 0 and 255, 0 being invisible and 255 fully visible)\\nnodeName.setOpacity( 100 );\\n\\n// get the node's opacity (returns a Number)\\nnodeName.getOpacity( );\\n\\n// set the node's colour (takes a cc.Color)\\nnodeName.setColor( new cc.Color(red, green, blue, alpha) );\\n\\n// get the node's colour (returns a cc.Color)\\nnodeName.getColor( );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nHere are all the different permutations the *setColor* method can take.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"nodeName->setColor( Color3B::BLACK );\\n\\nnodeName->setColor( Color3B::BLUE );\\n\\nnodeName->setColor( Color3B::GRAY );\\n\\nnodeName->setColor( Color3B::GREEN );\\n\\nnodeName->setColor( Color3B::MAGENTA );\\n\\nnodeName->setColor( Color3B::ORANGE );\\n\\nnodeName->setColor( Color3B::RED );\\n\\nnodeName->setColor( Color3B::WHITE );\\n\\nnodeName->setColor( Color3B::YELLOW );\\n\\n// Red, Green and Blue values range between 0 and 255\\nnodeName->setColor( Color3B( Red, Green, Blue ) );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    }\n  ]\n}\n[/block]\n##**Adding A Node To A Scene** - there are several different way of adding\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// add a node with a z-index of 0\\nthis->addChild( nodeName );\\n\\n// add a node with a custom z-index value (takes an integer)\\nthis->addChild( nodeName, 2 );\\n\\n// add a node with a custom z-index value and a tag (takes 2 integers)\\nthis->addChild( nodeName, 2, 65 );\\n\\n// add a node with a custom z-index value and a name (takes an integer and a string)\\nthis->addChild( nodeName, 2, \\\"Name of node\\\" );\\n\\n// get node by tag that has been previously added (returns a Node *)\\nthis->getChildByTag( 2 );\\n\\n// get node by name that has been previously added (returns a Node *)\\nthis->getChildByName( \\\"Name of node\\\" );\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// add a node with a z-index of 0\\nthis.addChild( nodeName );\\n\\n// add a node with a custom z-index value (takes a Number)\\nthis.addChild( nodeName, 2 );\\n\\n// add a node with a custom z-index value and a tag (takes 2 Numbers)\\nthis.addChild( nodeName, 2, 65 );\\n\\n// get node by tag that has been previously added (returns a Node)\\nthis.getChildByTag( 2 );\\n\\n// get node by name that has been previously added (returns a Node)\\nthis.getChildByName( \\\"Name of node\\\" );\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nNote: *Use the keyword **'this'** only if the node is being added within a scene otherwise use the layer name.*\n\n##**Removing A Node** - there are different methods for removing nodes\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"// removes the node from it's parent, cleans up all running actions aswell\\nnodeName->removeFromParent( );\\n\\n// removes the node from it's parent and you can specify if you want any running actions to be cleaned up\\nnodeName->removeFromParentAndCleanup( false );\\n\\n// remove a particular node from it's container, cleans up all running actions aswell\\nthis->removeChild( nodeName );\\n\\n// remove a particular node from it's container, the second parameter is optional to specify if the node's running actions should be cleaned up\\nthis->removeChild( nodeName, false );\\n\\n// remove a node from it's container based on the node's tag, cleans up all running actions aswell\\nthis->removeChildByTag( 6 );\\n\\n// remove a node from it's container based on the node's tag, the second parameter is optional to specify if the node's running actions should be cleaned up\\nthis->removeChildByTag( 6, false );\\n\\n// remove a node from it's container based on the node's name, cleans up all running actions aswell\\nthis->removeChildByName( \\\"Name of node\\\" );\\n\\n// remove a node from it's container based on the node's name, the second parameter is optional to specify if the node's running actions should be cleaned up\\nthis->removeChildByName( \\\"Name of node\\\", false );\\n\\n// remove all the children (node's) from the container\\nthis->removeAllChildren( );\\n\\n// remove all the children (node's) from the container and specify if you want the node's running actions to be cleaned up\\nthis->removeAllChildrenWithCleanup( false )\",\n      \"language\": \"cplusplus\",\n      \"name\": \"Cocos2d-x C++\"\n    },\n    {\n      \"code\": \"// removes the node from it's parent, cleans up all running actions aswell\\nnodeName.removeFromParent( );\\n\\n// removes the node from it's parent and you can specify if you want any running actions to be cleaned up\\nnodeName.removeFromParentAndCleanup( false );\\n\\n// remove a particular node from it's container, cleans up all running actions aswell\\nthis.removeChild( nodeName );\\n\\n// remove a particular node from it's container, the second parameter is optional to specify if the node's running actions should be cleaned up\\nthis.removeChild( nodeName, false );\\n\\n// remove a node from it's container based on the node's tag, cleans up all running actions aswell\\nthis.removeChildByTag( 6 );\\n\\n// remove a node from it's container based on the node's tag, the second parameter is optional to specify if the node's running actions should be cleaned up\\nthis.removeChildByTag( 6, false );\\n\\n// remove all the children (node's) from the container\\nthis.removeAllChildren( );\\n\\n// remove all the children (node's) from the container and specify if you want the node's running actions to be cleaned up\\nthis.removeAllChildrenWithCleanup( false )\",\n      \"language\": \"javascript\",\n      \"name\": \"Cocos2d-JS\"\n    }\n  ]\n}\n[/block]\nNote: *Use the keyword **'this'** only if the node is being added within a scene otherwise use the layer name.*","excerpt":"This page will cover the functions for a general node be it a sprite or a label.","slug":"nodes","type":"basic","title":"Nodes"}

Nodes

This page will cover the functions for a general node be it a sprite or a label.

Pretty much everything in Cocos derives from nodes such as scenes and sprites. Cocos provides nodes with common functionality such as position, scale, z-index, rotation plus much more. What this essentially means is that most of the objects you will add have similar functions hence they will be covered on this page. ##**Local Z-index** - z-order relative to its siblings in the scene [block:code] { "codes": [ { "code": "/*\nsets the local z-index (must by an integer)\nnodes with a higher z-index appear above nodes with lower z-index's\n*/\nnodeName->setLocalZOrder( 5 );\n\n// gets the local z-index value (returns an integer)\nnodeName->getLocalZOrder( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "/*\nsets the local z-index (must by an Number)\nnodes with a higher local z-index appear above nodes with lower z-index's\n*/\nnodeName.setLocalZOrder( 5 );\n\n// gets the local z-index value (returns a Number)\nnodeName.getLocalZOrder( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Global Z-index** - defines the order in which the nodes are rendered [block:code] { "codes": [ { "code": "/*\nsets the global z-index (must by an float)\nnodes with a lower global z-index are rendered first\n*/\nnodeName->setGlobalZOrder( 5.0 );\n\n// gets the global z-index value (returns an integer)\nnodeName->getGlobalZOrder( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "/*\nsets the global z-index (must by a Number)\nnodes with a lower global z-index are rendered first\n*/\nnodeName.setGlobalZOrder( 5 );\n\n// gets the global z-index value (returns a Number)\nnodeName.getGlobalZOrder( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Scale** - scaling factor of the node and its children [block:code] { "codes": [ { "code": "// scaling factor that multiplies the width of the node and its children (takes a float)\nnodeName->setScaleX( 0.5 );\n\n// returns the scale factor in the x-axis (returns a float)\nnodeName->getScaleX( );\n\n// scaling factor that multiplies the height of the node and its children (takes a float)\nnodeName->setScaleY( 0.5 );\n\n// returns the scale factor in the y-axis (returns a float)\nnodeName->getScaleY( );\n\n// scaling factor that multiplies the z-axis of the node and its children (takes a float)\nnodeName->setScaleZ( 0.5 );\n\n// returns the scale factor in the z-axis (returns a float)\nnodeName->getScaleZ( );\n\n// scales the node in the x, y and z axis (take a float)\nnodeName->setScale( 0.5 );\n\n// returns the scale factor for the x and y axis if they are the same (returns a float)\nnodeName->getScale( );\n\n// scales the node's height and width (takes 2 floats)\nnodeName->setScale( 0.5, 0.2 );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// scaling factor that multiplies the width of the node and its children (takes a Number)\nnodeName.setScaleX( 0.5 );\n\n// returns the scale factor in the x-axis (returns a Number)\nnodeName.getScaleX( );\n\n// scaling factor that multiplies the height of the node and its children (takes a Number)\nnodeName.setScaleY( 0.5 );\n\n// returns the scale factor in the y-axis (returns a Number)\nnodeName.getScaleY( );\n\n// scaling factor that multiplies the z-axis of the node and its children (takes a Number)\nnodeName.setScaleZ( 0.5 );\n\n// returns the scale factor in the z-axis (returns a Number)\nnodeName.getScaleZ( );\n\n// scales the node in the x, y and z axis (take a Number)\nnodeName.setScale( 0.5 );\n\n// returns the scale factor for the x and y axis if they are the same (returns a Number)\nnodeName.getScale( );\n\n// scales the node's height and width (takes 2 Numbers)\nnodeName.setScale( 0.5, 0.2 );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Note: *Default scale value is 1* Warning: *Physics body doesn't support this* ##**Position** - position of the node [block:code] { "codes": [ { "code": "// set the node's position using a Vec2\nnodeName->setPosition( Vec2( 50.0, 100.0 ) );\n\n// get the node's position (returns a Vec2 &)\nnodeName->getPosition( );\n\n// get node position result x and y\nresult.x;\nresult.y;\n\n// set the node's position using normalized coordinates (between 0 and 1)\nnodeName->setNormalizedPosition( Vec2( 0.5, 0.7l ) );\n\n// get the node's position using normalized coordinates\nnodeName->getNormalizedPosition( );\n\n// get node's normalized position result x and y\nnormalizedResult.x;\nnormalizedResult.y;\n\n// set the node's position using 2 float values\nnodeName->setPosition( 50.0, 100.0 );\n\n// get the node's position but takes 2 float * paramaters instead of returning a value, the x and y positions are assigned to the parameters\nfloat *x, *y;\nsprite->getPosition( x, y );\n\n// set the node's x and y positions individually (takes a float)\nnodeName->setPositionX( 50.0 );\nnodeName->setPositionY( 50.0 );\n\n// get the node's x and y positions individually (returns a float)\nnodeName->getPositionX( );\nnodeName->getPositionY( );\n\n// set the node's position but in 3D space using a Vec3\nnodeName->setPosition( Vec3( 100.0, 200.0, 50.0 ) );\n\n// get the node's 3D position (returns a Vec3)\nnodeName->getPosition3D( );\n\n// get node's position result x, y and z\nresult3D.x;\nresult3D.y;\nresult3D.y;\n\n// set the node's z position using a float value\nnodeName->setPositionZ( 50.0 );\n\n// get the node's z position (returns a float)\nnodeName->getPositionZ( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's position\nnodeName.setPosition( cc.p( 50, 100 ) );\n\n// get the node's position (returns a cc.Point)\nnodeName.getPosition( );\n\n// get node position result x and y\nresult.x;\nresult.y;\n\n// set the node's position using 2 Numbers\nnodeName.setPosition( 50.0, 100.0 );\n\n// set the node's x and y positions individually (takes a Number)\nnodeName.setPositionX( 50.0 );\nnodeName.setPositionY( 50.0 );\n\n// get the node's x and y positions individually (returns a Number)\nnodeName.getPositionX( );\nnodeName.getPositionY( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Skewing** - distorts/stretches the node by skewing the angles in degrees [block:code] { "codes": [ { "code": "// skew the node's angles (takes a float value)\nnodeName->setSkewX( 10.0 );\nnodeName->setSkewY( 10.0 );\n\n// get the node's skew angles (returns a float value)\nnodeName->getSkewX( );\nnodeName->getSkewY( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// skew the node's angles (takes a Number)\nnodeName.setSkewX( 10.0 );\nnodeName.setSkewY( 10.0 );\n\n// get the node's skew angles (returns a Number)\nnodeName.getSkewX( );\nnodeName.getSkewY( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Warning: *Physics body doesn't support this* ##**Anchor Point** - anchorPoint is the point around which all transformations and positioning manipulations take place essentially like a pin [block:code] { "codes": [ { "code": "// set the node's anchor point using a Vec2 &\nnodeName->setAnchorPoint( Vec2( 0.5, 0.5 ) );\n\n// get the node's anchor point (returns a Vec2 &)\nnodeName->getAnchorPoint( );\n\n// get the node's anchor point in pixels (returns a Vec2 &)\nnodeName->getAnchorPointInPoints( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's anchor point using a cc.p\nnodeName.setAnchorPoint( cc.p( 0.5, 0.5 ) );\n\n// get the node's anchor point (returns a cc.Point)\nnodeName.getAnchorPoint( );\n\n// get the node's anchor point in pixels (returns a cc.Point)\nnodeName.getAnchorPointInPoints( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Warning: *If node has a physics body, the anchor point must be in the middle, you can't change this to another value.* ##**Content Size** - sets the untransformed size of the node [block:code] { "codes": [ { "code": "// set the node's content size (takes a Size & parameter)\nnodeName->setContentSize( Size( 30.0, 90.0 ) );\n\n// get the node's content size (returns a Size &)\nnodeName->getContentSize( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's content size (takes a cc.size parameter)\nnodeName.setContentSize( cc.size( 30.0, 90.0 ) );\n\n// get the node's content size (returns a cc.size)\nnodeName.getContentSize( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Visibility** - sets whether or not the node is visible [block:code] { "codes": [ { "code": "// set the node's visibility (takes a bool, true is visible and false is invisible)\nnodeName->setVisible( true );\n\n// get the node's visibility status (returns a bool)\nnodeName->isVisible( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's visibility (takes a Boolean, true is visible and false is invisible)\nnodeName.setVisible( true );\n\n// get the node's visibility status (returns a Boolean)\nnodeName.isVisible( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Rotation** - sets the rotation (angle) of the node in degrees [block:code] { "codes": [ { "code": "// set the node's rotation (takes a float value)\nnodeName->setRotation( 45.0 );\n\n// get the node's rotation (returns a float value)\nnodeName->getRotation( );\n\n// set 3D rotation (takes a Vec3 &)\nnodeName->setRotation3D( Vec3( 45.0, 125.0, 20.0 ) );\n\n// get the 3D rotation (returns a Vec3 &)\nnodeName->getRotation3D( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's rotation (takes a Number)\nnodeName.setRotation( 45.0 );\n\n// get the node's rotation (returns a Number)\nnodeName.getRotation( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Note: *0 is the default rotation angle.* Note: *Positive values rotate node clockwise, and negative values for anti-clockwise.* ##**Skew Rotation** - to be used in conjunction with skewing [block:code] { "codes": [ { "code": "// set the node's skew rotation angles (takes a float)\nnodeName->setRotationSkewX( 40.0 );\nnodeName->setRotationSkewY( 60.0 );\n\n// get the node's skew rotation angles (returns a float)\nnodeName->getRotationSkewX( );\nnodeName->getRotationSkewY( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's skew rotation angles (takes a Number)\nnodeName.setRotationX( 40.0 );\nnodeName.setRotationY( 60.0 );\n\n// get the node's skew rotation angles (returns a Number)\nnodeName.getRotationX( );\nnodeName.getRotationY( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Tag and Name** - used to identify a node [block:code] { "codes": [ { "code": "// set the node's tag (takes an integer)\nnodeName->setTag( 5 );\n\n// get the node's tag (returns an integer)\nnodeName->getTag( );\n\n// set the node's name (takes a String)\nnodeName->setName( \"Name\" );\n\n// get the node's tag (returns a String)\nnodeName->getName( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's tag (takes a Number)\nnodeName.setTag( 5 );\n\n// get the node's tag (returns a Number)\nnodeName.getTag( );\n\n// set the node's name (takes a String)\nnodeName.setName( \"Name\" );\n\n// get the node's name (returns a String)\nnodeName.getName( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Node's Scene** - get the node that the scene belongs to [block:code] { "codes": [ { "code": "// returns the node that the Scene belongs to\n// if the node doesn't belong to any scene then 'nullptr' is returned\nnodeName->getScene( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// no JavaScript equivalent", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Bounding Box** - rectangular box that contains the node [block:code] { "codes": [ { "code": "// get the node's bounding box (returns a Rect)\nnodeName->getBoundingBox( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// get the node's bounding box (returns a cc.Rect)\nnodeName.getBoundingBox( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] ##**Actions** - actions allow a node's properties to be manipulated [block:code] { "codes": [ { "code": "// run an Action (plus return the Action that is executed)\nnodeName->runAction( actionToRun );\n\n// stops all the running actions\nnodeName->stopAllActions( );\n\n// stop a particular action\nnodeName->stopAction( actionToStop );\n\n// stop an action based on it's tag (takes an integer)\nnodeName->stopActionByTag( 5 );\n\n// retrieves a running action based on it's tag (returns an integer)\nnodeName->getActionByTag( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// run an cc.Action (plus return the cc.Action that is executed)\nnodeName.runAction( actionToRun );\n\n// stops all the running actions\nnodeName.stopAllActions( );\n\n// stop a particular cc.Action\nnodeName.stopAction( actionToStop );\n\n// stop an cc.Action based on it's tag (takes a Number)\nnodeName.stopActionByTag( 5 );\n\n// retrieves a running cc.Action based on it's tag (returns a Number)\nnodeName.getActionByTag( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Note: *Every action will be covered in a separate section.* ##**Physics Body** - physics body allow collisions to take place [block:code] { "codes": [ { "code": "// set the physics body for the node (takes a PhysicsBody *)\nnodeName->setPhysicsBody( physicsBody );\n\n// get the node's physics body (returns a PhysicsBody *)\nnodeName->getPhysicsBody( );", "language": "cplusplus", "name": "Cocos2d-x C++" } ] } [/block] ##**Opacity And Colour** - the visibility and colour of the node [block:code] { "codes": [ { "code": "// set the node's opacity (takes a GLubyte ranging between 0 and 255, 0 being invisible and 255 fully visible)\nnodeName->setOpacity( 100 );\n\n// get the node's opacity (returns a GLubyte)\nnodeName->getOpacity( );\n\n// set the node's colour (takes a Color3B)\nnodeName->setColor( color3BObject );\n\n// get the node's colour (returns a Color3B)\nnodeName->getColor( );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// set the node's opacity (takes a Number ranging between 0 and 255, 0 being invisible and 255 fully visible)\nnodeName.setOpacity( 100 );\n\n// get the node's opacity (returns a Number)\nnodeName.getOpacity( );\n\n// set the node's colour (takes a cc.Color)\nnodeName.setColor( new cc.Color(red, green, blue, alpha) );\n\n// get the node's colour (returns a cc.Color)\nnodeName.getColor( );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Here are all the different permutations the *setColor* method can take. [block:code] { "codes": [ { "code": "nodeName->setColor( Color3B::BLACK );\n\nnodeName->setColor( Color3B::BLUE );\n\nnodeName->setColor( Color3B::GRAY );\n\nnodeName->setColor( Color3B::GREEN );\n\nnodeName->setColor( Color3B::MAGENTA );\n\nnodeName->setColor( Color3B::ORANGE );\n\nnodeName->setColor( Color3B::RED );\n\nnodeName->setColor( Color3B::WHITE );\n\nnodeName->setColor( Color3B::YELLOW );\n\n// Red, Green and Blue values range between 0 and 255\nnodeName->setColor( Color3B( Red, Green, Blue ) );", "language": "cplusplus", "name": "Cocos2d-x C++" } ] } [/block] ##**Adding A Node To A Scene** - there are several different way of adding [block:code] { "codes": [ { "code": "// add a node with a z-index of 0\nthis->addChild( nodeName );\n\n// add a node with a custom z-index value (takes an integer)\nthis->addChild( nodeName, 2 );\n\n// add a node with a custom z-index value and a tag (takes 2 integers)\nthis->addChild( nodeName, 2, 65 );\n\n// add a node with a custom z-index value and a name (takes an integer and a string)\nthis->addChild( nodeName, 2, \"Name of node\" );\n\n// get node by tag that has been previously added (returns a Node *)\nthis->getChildByTag( 2 );\n\n// get node by name that has been previously added (returns a Node *)\nthis->getChildByName( \"Name of node\" );", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// add a node with a z-index of 0\nthis.addChild( nodeName );\n\n// add a node with a custom z-index value (takes a Number)\nthis.addChild( nodeName, 2 );\n\n// add a node with a custom z-index value and a tag (takes 2 Numbers)\nthis.addChild( nodeName, 2, 65 );\n\n// get node by tag that has been previously added (returns a Node)\nthis.getChildByTag( 2 );\n\n// get node by name that has been previously added (returns a Node)\nthis.getChildByName( \"Name of node\" );", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Note: *Use the keyword **'this'** only if the node is being added within a scene otherwise use the layer name.* ##**Removing A Node** - there are different methods for removing nodes [block:code] { "codes": [ { "code": "// removes the node from it's parent, cleans up all running actions aswell\nnodeName->removeFromParent( );\n\n// removes the node from it's parent and you can specify if you want any running actions to be cleaned up\nnodeName->removeFromParentAndCleanup( false );\n\n// remove a particular node from it's container, cleans up all running actions aswell\nthis->removeChild( nodeName );\n\n// remove a particular node from it's container, the second parameter is optional to specify if the node's running actions should be cleaned up\nthis->removeChild( nodeName, false );\n\n// remove a node from it's container based on the node's tag, cleans up all running actions aswell\nthis->removeChildByTag( 6 );\n\n// remove a node from it's container based on the node's tag, the second parameter is optional to specify if the node's running actions should be cleaned up\nthis->removeChildByTag( 6, false );\n\n// remove a node from it's container based on the node's name, cleans up all running actions aswell\nthis->removeChildByName( \"Name of node\" );\n\n// remove a node from it's container based on the node's name, the second parameter is optional to specify if the node's running actions should be cleaned up\nthis->removeChildByName( \"Name of node\", false );\n\n// remove all the children (node's) from the container\nthis->removeAllChildren( );\n\n// remove all the children (node's) from the container and specify if you want the node's running actions to be cleaned up\nthis->removeAllChildrenWithCleanup( false )", "language": "cplusplus", "name": "Cocos2d-x C++" }, { "code": "// removes the node from it's parent, cleans up all running actions aswell\nnodeName.removeFromParent( );\n\n// removes the node from it's parent and you can specify if you want any running actions to be cleaned up\nnodeName.removeFromParentAndCleanup( false );\n\n// remove a particular node from it's container, cleans up all running actions aswell\nthis.removeChild( nodeName );\n\n// remove a particular node from it's container, the second parameter is optional to specify if the node's running actions should be cleaned up\nthis.removeChild( nodeName, false );\n\n// remove a node from it's container based on the node's tag, cleans up all running actions aswell\nthis.removeChildByTag( 6 );\n\n// remove a node from it's container based on the node's tag, the second parameter is optional to specify if the node's running actions should be cleaned up\nthis.removeChildByTag( 6, false );\n\n// remove all the children (node's) from the container\nthis.removeAllChildren( );\n\n// remove all the children (node's) from the container and specify if you want the node's running actions to be cleaned up\nthis.removeAllChildrenWithCleanup( false )", "language": "javascript", "name": "Cocos2d-JS" } ] } [/block] Note: *Use the keyword **'this'** only if the node is being added within a scene otherwise use the layer name.*