Healthbar damage effect

Basically, I’ve seen games where if you get damaged the health bar (red or green) goes down, And then there’s a second bar which is usually white, That shows you how much got taken away before going down after a couple of seconds.

Gif of this happening (Not mine obviously)
https://gyazo.com/88fe8248fa5d68a1abc72afe686662f2

Also i’ve tried to search multiple topics on this on the devforum but can’t seem to find one that covers this, I’ve also checked youtube, But they are all simple healthbars without this effect.

I have absolutely no idea how to make this or where to start so anything will help.

1 Like

When you take damage, tween the white bar to position where the red bar is. It will smoothly move towards your health.

1 Like

How would i make it wait a couple of seconds and when more damage gets taken right before it should shrink towards the health, It would restart the timer? Seeing how if i use wait with lets say spawn() it would bug and still move the hp bar since it doesnt cancel it

wdym? Follow a simple tutorial of a health bar. Then duplicated the real health bar. Make this a layer lower. Everytime you take damage tween it to the positon of the calculated size of the red bar.

spawn(function()
       wait(5)
       -- move damageeffect back
end)

This wouldn’t work, Since if we start the wait, No matter if we take more damage, It will still run without resetting the timer, This would bug the healthbar out

Tweens affecting the same object and property override eachother, playing the most recent one. So you could implement this creating a delayed tween every time a player takes damage, if the player doesn’t take damage it plays normally, if it does the delay is reset.
local Tweeninfo = TweenInfo.new(OtherProperties,Delay)

Tween has a delay property? (30 eeeee)

Yeah! Check it out here TweenInfo | Roblox Creator Documentation

1 Like