How do you do HP bars?

This forum is currently in read-only mode.
  • I'm currently confused on how to make HP/MP/Etc Bars similar to fighting games. Like for example, when an enemy hits the player, the HP bar will slowly resize to its designated point. In other words, if I have a bar at 100%, and an enemy hits me, which decreases my HP to 80%, the HP bar should slowly resize until the 100% bar arrives at 80%.

    Unlike in the platform school where HP is changed using different animation frames of the Heart Image, I'm not sure if I can use that principle in this one. Help anyone? Thanks in advance!

  • Easiest right now is resizing an image based on percent. If you make an image that's 200x32 (200 being width) you can do this, using a variable "HealthVariable" who's max value is 1000:

    Set width to ===> Bar.OriginalWidth*(HealthVariable/1000)

    That will set the width based on what percentage between 0 and 1000 HealthVariable is. To make it regenerate, just add to HealthVariable.

  • I quickly made a little example for you: Download

  • Pfft, my way is better, no need for a fixed original width.

  • Pfft, my way is better, no need for a fixed original width.

    Your talking about the Maxwidth value of the healthbar?

    Just set it on start of layout to the width, so you don't have to reenter the value if you change it in the layout.

    And how exactly does your example help with the bar slowly resizing?

  • Yey! Thanks for the help guys, that was quick. Amazing!!

  • And how exactly does your example help with the bar slowly resizing?

    Just add to your health variable. When you want it to not be greater than 1000 just have an event to say to stop it from being that.

    I'm sure both our techniques are fine, I was kidding, man. I guess I missed that it would gradually change instead of regenerate.

  • Don't forget about the line object, the gradient object, the tiled bg object, the box object.......

  • I'm sure both our techniques are fine, I was kidding, man.

    It didn't strike me as dead serious, due to the amount of smilies used. There's one again.

    Still why did you reply faster than I did? Don't do that again!

    Yey! Thanks for the help guys, that was quick. Amazing!!

    No prob. As long as the questions are simple enough for my brain, I will always try to help out, hehe. And many other users do the same thing. You did know this community rocked?

    Don't forget about the line object, the gradient object, the tiled bg object, the box object.......

    Indeed. Wasn't there something in the Uploads section with many different healthbar examples?

  • Hmm yeah this community rocks.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • this thread has some interesting examples:

    http://www.scirra.com/phpBB3/viewtopic.php?f=3&t=4736

  • Don't forget about the line object, the gradient object, the tiled bg object, the box object.......

    don't forget the sprite font too!

  • Or a distort map, I've used it for that before.

  • Hmm. I have it set up like this right now:

    Player_healthbar: Set width to Clamp(Player.value('HP') / 3, 0, 30)

    (Player.value('HP') / 3 defines the width of the bar.

    , 0 = minimum value

    , 30 = maximum value

    You can clamp the Player HP Private Variable as well, so that it never goes over 100.

  • I use sprite font for these types of HUD bars:

    <img src="http://i35.tinypic.com/6xzvko.jpg">

    I just go always: showtext: left( "aaaaaaaaa", hpvalue)

    where "a" represents a sprite for one HP slot thing, then it only shows X amount of the "a"s from the left.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)