Make a SKLabelNode in spritekit appear above all other sprites

Question

Hi im pretty new to programming and I have encountered a small issue. I am creating a simple game which has a score label. However, the score label is covered whenever a downward scrolling obstacle passes. I would like for the score label to not be covered by the obstacles.Is there a way i can change the sprite hierarchy in spritekit? Thanks

Answer 1

I would recommend creating a node for the static stuff that should be fixed on screen (like a game HUD). Then you set this node's zPosition to be higher then the game play node (where all game objects are placed and manipulated).

This makes it also easier implementing a camera or moving the game play node if needed without the score label or any other fixed hud element moving as well.

So you will have something like this :

SKNode *hudNode = [SKNode node];
hudNode.zPosition = 1000;
[hudNode addChild:scoreLabel];

SKNode *gamePlayNode = [SKNode node];
gamePlayNode.zPosition = 0; // Not mandatory as it defaults to 0 but I put this here for clarification

[self addChild:hudNode]; // self is your scene instance
[self addChild:gamePlayNode]; 

Answer 2

You can change the zPosition property of your label node, by making it 100 it will be above all other nodes (default value is 0.0):

labelNode.zPosition = 100;

Answer 3

Nodes are drawn in the order they are added to the scene (or parent node). You can change the order in which nodes are drawn by setting their zPosition property.

From Apple's documentation...

...The z position is the node’s height relative to its parent node, much as a node’s position property represents its x and y position relative to parent’s position. So you use the z position to place a node above or below the parent’s position.

When you take z positions into account, here is how the node tree is rendered:

• Each node’s global z position is calculated.
• Nodes are drawn in order from smallest z value to largest z value.
• If two nodes share the same z value, ancestors are rendered first, and siblings are rendered in child order.

You can also use zPosition to optimize rendering performance...

...it might be better if Sprite Kit could gather all of the nodes that share the same texture and drawing mode and and draw them with a single drawing pass. To enable these sorts of optimizations, you set the view’s ignoresSiblingOrder property to YES.