[Basic Objects] Sprite

Adding A Sprite

Drag a Sprite from the Basic Objects section onto the middle canvas.

260

Selecting The Sprite

You can select the sprite if it isn't already selected from the Animation Editor at the bottom. The sprite doesn't appear in the resources as it's part of the Scene or other object that you are using.

258

Changing The Image

You have 2 options when changing the image of the sprite:

  • Double click the Image Resource icon in the properties section and select an image from your computer. The image will be added to the resources as well.
  • Drag an image from the Resources section onto the Image Resource icon in the properties section.
357

Accessing The Sprite In Code

Sprites can be accessed via their Name or Tag which can be set in the Properties section.

354

To access the sprite from a scene for example, in code it is simple. You either access it as a Node or cast it to a Sprite allowing you to use Sprite methods along with Node methods.

Node *rootNode = CSLoader::createNode( "Filepath to .csb file" );
this->addChild( rootNode );

// sprite accessed as a node using it's name
Node *sprite = rootNode->getChildByName( "Name set in Cocos Studio" );

// sprite cast to a sprite using it's name
Sprite *sprite = ( Sprite * )rootNode->getChildByName( "Name set in Cocos Studio" );

// sprite accessed as a node using it's tag
Node *sprite = rootNode->getChildByTag( 5 );

// sprite cast to a sprite using it's tag
Sprite *sprite = ( Sprite * )rootNode->getChildByTag( 5 );
var rootNode = ccs.load( "Filepath to .json file" );
this.addChild( rootNode.node );

// get the sprite by name
var sprite = rootNode.node.getChildByName( "Name set in Cocos Studio" );

// get the sprite by tag
var sprite = rootNode.node.getChildByTag( 5 );

Note: Cocos2d-JS doesn't require casting to use sprite methods.