Question

I am making a game with cocos2d and would like to implement a progress bar to represent my player’s health. I have referenced how to create a progressbar programmatically but a CCLayer does not have a .view attribute. Can someone please point me in the right direction or help me out?

Thank you,
Joey

Answer 1

Grab the following image: https://i.stack.imgur.com/O5DRf.png. It is 2×30. I want to make a bar that is 15 pixels high. Normally, the dimensions would be 1×15, but since I assume you’re working with retina display, we have to double such dimensions to 2×30.

Create a CCSprite with it, and set the anchor point to ccp(0.0,0.5):

CCSprite *bar = [CCSprite spriteWithFile:@"MyBar.png"];   // Create it
bar.position = ccp(240,160);                                // Position it
bar.anchorPoint = ccp(0.0,0.5);                           // Anchor point

Now the question is, how long (max) is the health bar? Let us say it is 200 pixels long. Therefore, 100% = 200 pixels long. Let us set it to 200 pixels long then:

bar.scaleX = 200;    // The bar is 200 pixels long now

So, how about 50% of health? Then, clearly, the property .scaleX should be 100.

bar.scaleX = 100;    // The bar is 100 pixels long now (50% health)

That is pretty much all you might need to create a simple bar quickly.