(SOLVED)Healthbar with sprites, gradual change?

Gasil

Member
Hello, I need a little clever way to do the following:

I am using a custom healthbar I drew, using this code:

Code:
///The empty representation of the bar, the background.
draw_sprite(spr_salud_fondo, 0, view_xport[0], view_yport[0]);

///The actual healthbar.
draw_sprite_ext(spr_salud_barra, 0,view_xport[0] + 60, view_yport[0] + 40,
                obj_player.Salud / obj_player.maxSalud, 1, 0, c_white, 1);

///The border and health icon.
draw_sprite(spr_salud_borde, 0, view_xport[0], view_yport[0]);
I am using draw_sprite_ex on the healthbar so I can manipulate its width with image_xscale; it works fairly well and I'm content, however the healthbar of course depletes in chunks whenever the player takes damage.

I was trying to think in a way to make it shrink gradually like the built-in healthbars GM2 offers, but my logics fail me and I can't come up with a method to do so.

Could you help me please with any ideas to achieve that?

Thank you.
 

acidemic

Member
You should use another variable to show the healthbar something like "obj_player.Salud_Display" and in the 'Step' event use something like
Code:
if (obj_player.Salud_Display < obj_player.Salud)
{
    obj_player.Salud_Display += 0.2;
}
else if (obj_player.Salud_Display > obj_player.Salud)
{
    obj_player.Salud_Display -= 0.2;
}
this way, it will gradually change on the screen. You can use any other step instead of 0.2.... something like 0.1 or 0.25 or 0.5
 

trentallain

Member
Hello, I need a little clever way to do the following:

I am using a custom healthbar I drew, using this code:

Code:
///The empty representation of the bar, the background.
draw_sprite(spr_salud_fondo, 0, view_xport[0], view_yport[0]);

///The actual healthbar.
draw_sprite_ext(spr_salud_barra, 0,view_xport[0] + 60, view_yport[0] + 40,
                obj_player.Salud / obj_player.maxSalud, 1, 0, c_white, 1);

///The border and health icon.
draw_sprite(spr_salud_borde, 0, view_xport[0], view_yport[0]);
I am using draw_sprite_ex on the healthbar so I can manipulate its width with image_xscale; it works fairly well and I'm content, however the healthbar of course depletes in chunks whenever the player takes damage.

I was trying to think in a way to make it shrink gradually like the built-in healthbars GM2 offers, but my logics fail me and I can't come up with a method to do so.

Could you help me please with any ideas to achieve that?

Thank you.
Draw the health bar using another value as the xscale that lerps to the actual value.

value = lerp(value,original_value,0.2)
 

Gasil

Member
You should use another variable to show the healthbar something like "obj_player.Salud_Display" and in the 'Step' event use something like
Code:
if (obj_player.Salud_Display < obj_player.Salud)
{
    obj_player.Salud_Display += 0.2;
}
else if (obj_player.Salud_Display > obj_player.Salud)
{
    obj_player.Salud_Display -= 0.2;
}
this way, it will gradually change on the screen. You can use any other step instead of 0.2.... something like 0.1 or 0.25 or 0.5
Good idea D: I'm going to try it to see how it works.
 

Gasil

Member
Draw the health bar using another value as the xscale that lerps to the actual value.

value = lerp(value,original_value,0.2)
Lerp, I've never heard such term before, I'm going to read the documentation about it and try to understand it and use it... I'll let you both know if I mess up, if you don't mind.
 

Gasil

Member
@acidemic I could pull it off, thank you kindly.

@trentallain ... I wasn't able to understand enough the lerp formula to know how to use it. Would you care telling me how to use it in my code and a little explanation about it, please? I could stick with acidemic's method, but I'm curious that maybe I could use the lerp for something else.
 

trentallain

Member
@acidemic I could pull it off, thank you kindly.

@trentallain ... I wasn't able to understand enough the lerp formula to know how to use it. Would you care telling me how to use it in my code and a little explanation about it, please? I could stick with acidemic's method, but I'm curious that maybe I could use the lerp for something else.
Basically it will make the value go up/down until it equals the value you want. Going by what @acidemic said, you could use it by doing:
obj_player.Salud_Display = lerp(obj_player.Salud_Display,obj_player.Salud,0.2);
 

CMAllen

Member
What I did was use two health values -- current and displayed, and define a rate at which the displayed is adjusted to match the current value (and when difference was smaller than the change rate, just set display to equal current). I tried lerp, but I just wasn't satisfied with the results because it was either too slow for small changes or too fast for large changes.
 

Gasil

Member
What I did was use two health values -- current and displayed, and define a rate at which the displayed is adjusted to match the current value (and when difference was smaller than the change rate, just set display to equal current). I tried lerp, but I just wasn't satisfied with the results because it was either too slow for small changes or too fast for large changes.
You're right, its behavior was a bit in the middle, I will try your method too and see which one I'll stick to. Thanks for helping me out!
 

CMAllen

Member
You can decrease the end value to make it slower. Lerp is exponential though.
That's true. You can modify the lerp rate based on the percentage difference between current and displayed health values. Inverse relationship, obviously. Greater difference, lower lerp value. Lesser difference, greater lerp value.
 
Top