How do I Animate HUD bars?

Get help using Construct 2

Post » Mon Feb 08, 2016 8:40 am

hi to all

In my game i have 3 bars for my character
Image
http://s15.postimg.org/vzddpve3d/HUDBARS.jpg

How to animate that?
how to make when the player get hit the blood bar lose some percent % of blood content and the same for stamina and poison?
I want when for example Blood is empty then player die.
B
32
S
12
G
6
Posts: 1,625
Reputation: 8,575

Post » Mon Feb 08, 2016 4:29 pm

Is the bar "filled"? Ie. do you have a second sprite of an empty bar with an internal color fill? Have you tried simply setting the bar width to 100 or another set value and reducing its width the amount of damage taken? If its doesn't drain and show an empty sprite you could also put the bar on a lower layer than the end cap and put a background colored sprite behind the end cap to edge of screen and then shift the health bar to the left "behind" them with each increment of damage.
Check out my completed games on the Arcade! Capt. Doe Save the Universe! & Clicker Wizard!
B
56
S
15
G
8
Posts: 611
Reputation: 8,823

Post » Tue Feb 09, 2016 10:19 am

yes i have an empty layer and the blood in another (photoshop)
B
32
S
12
G
6
Posts: 1,625
Reputation: 8,575

Post » Tue Feb 09, 2016 2:19 pm

You could use some voodoo magic (*cough*Math*cough*) to calculate the current percentage of your max health, then scale the upper layer (content) of the bar to said percentage of its max width. Or, as @chrisinfinger said put a second background at the end of your bar, and increase that in size the more health someone loses.

Note that you'll want two values for this to work, a MaxHealth value and a (Current)Health value so you can Mathematician your way to the desired result. And two sprites, of course. A separate background and content sprite for each bar.
B
5
Posts: 43
Reputation: 311

Post » Wed Feb 10, 2016 7:37 pm

A simple 5 minute file I made ages ago. Hope it helps.

https://dl.dropboxusercontent.com/u/108 ... thBar.capx
Using R243 for all examples
B
68
S
20
G
6
Posts: 378
Reputation: 9,672

Post » Wed Feb 10, 2016 8:00 pm

imothep85 wrote:yes i have an empty layer and the blood in another (photoshop)
Image
How to animate that?


when you say..animate..do you think something like this?
Image
Or?

Edit:
sorry..I forgot to post the capx...

there is probably a simpler way...but..
maybe you can start from here...


Blood2Bar.capx
Last edited by korbaach on Thu Feb 11, 2016 10:36 am, edited 1 time in total.
Image
B
62
S
23
G
7
Posts: 1,469
Reputation: 10,729

Post » Thu Feb 11, 2016 8:45 am

well yeah that can work :D
B
32
S
12
G
6
Posts: 1,625
Reputation: 8,575

Post » Thu Feb 11, 2016 10:37 am

New to Construct ? Where to start

Image Image

Image Image

Please attach a capx to any help request or bug report !
Moderator
B
273
S
100
G
71
Posts: 7,270
Reputation: 76,425

Post » Thu Feb 11, 2016 3:04 pm

@emoaeden's example is a great formula. Just remember it's current health, and initial size at a 100 percent.
Health*(256/100)
Image ImageImage
B
165
S
49
G
148
Posts: 8,050
Reputation: 97,092

Post » Thu Feb 11, 2016 9:18 pm

newt wrote:@emoaeden's example is a great formula. Just remember it's current health, and initial size at a 100 percent. Health*(256/100)


@imothep85 : The reason it's 256 is because it's 256 pixels wide, so if you have bars that are longer or shorter, just make sure you adjust accordingly. Probably an obvious statement, but just in case you're super new, thought I'd point it out :)
Using R243 for all examples
B
68
S
20
G
6
Posts: 378
Reputation: 9,672

Next

Return to How do I....?

Who is online

Users browsing this forum: ketramtu18 and 1 guest