Cocos2d-x - Understanding positioning sprites on screen


February 2019


6.8k time


Can anyone provide some basic pointers on placing CCSprites on screen?


CCSize s = CCDirector::sharedDirector()->getWinSize();

With s, say I wanted to position a sprite on the very bottom of the screen starting at 0, think something like grass.

if I am running at 1024 x 768, middle is:

setPosition( ccp(s.width/2, s.height/2) );

so starting all the way left and middle would be:

setPosition( ccp(0, s.height/2) );

So how do I get farther down?

setPosition( 0, s.height) );

This puts me starting at the top left and staying along the top of the screen.

Any help would be appreciated.

2 answers


Also Just to add something, all buttons start out in the middle of the screen then you can move them from there. if you wanted to button at (0,0):

CCLabelTTF *label1 = [CCLabelTTF labelWithString:@"Press Me!" fontName:@"Marker Felt" fontSize:20];
CCMenuItemLabel *button1 = [CCMenuItemLabel itemWithLabel:label1 block:^(id sender) {    NSLog(@"button1 pressed"); }];

button1.position = ccp(-(s.width/2) , -(s.height/2)); // <---

Position is relative to the sprite's parent, as well as its anchorPoint.

anchorPoint generally ranges from 0 to 1 for each coordinate, with a default of 0.5. I say "generally" because it can really be any value, but ranges outside of 0-1 place you outside of the bounds of the sprite.

For example, an anchorPoint of (0,0) makes positions relative to the bottom left. (1,0) is the bottom right, (0,1) is the top left and (1,1) is the top right. (0.5,0.5) is the very center of the sprite, which is the default.

Basically you just multiple the value by the width to get the relative position.

If you want to place a sprite at the very bottom of the screen (the bottom left corner aligned with the bottom left corner of the screen), you can do it multiple ways, based on the anchorPoint alone.

With the default anchorPoint of (0.5,0.5), the position would be (sprite.contentSize.width/2, sprite.contentSize.height/2).

If you set the anchorPoint to (0,0), the same position is obtained by simply (0,0).

If you wanted to move that sprite to the very center of the screen (the center of the sprite right in the middle), with an anchorpoint of (0.5, 0.5), the position would be (s.width/2, s.height/2).

This is all assuming you are adding a sprite to a parent the size of the screen, which is where the 2nd part of positioning comes in.

Position is also relative to the sprite's parent - which could be any other CCNode (CCLayer, another CCSprite, etc).

The way to think of that is not much different than adding a full screen node - except think in terms of the parent's size and position, not the screen.