Help with a basic health bar.


So pretty much I am new to lua and whatnot, wanting to give stuff a try, I got this script

function HealthHUD()
	local ply = LocalPlayer()
	local HP = ply:Health()
	draw.RoundedBox( 0, 5, ScrH() - 30, 300, 25, Color( 40, 40, 40, 150 ) )
	draw.RoundedBox( 0, 5, ScrH() - 30, math.Clamp( HP, 0, 200 )*3, 25, Color( 220, 108, 108, 255 ) )
	draw.RoundedBox( 0, 5, ScrH() - 30, math.Clamp( HP, 0, 200 )*3, 25, Color( 255, 255, 255, 40 ) )
hook.Add("HUDPaint", "HealthHUD", HealthHUD)

It’s displaying correctly ingame, seems to be working but my main problem is, it doesn’t seem to lower the bar when I get damaged, why is this? Help would be appreciated.

EDIT: Figured out it works, fall damage wasn’t removing any HP, How would I add an outline to the UI?

EDIT: Figured out the outline, the last question I have which I can’t seem to find is how would I make it somewhat like an animated loading bar? As in if you have 100 hp and go to 75 hp, it doesn’t just instanty go to 75 hp, the bar lowers from 100, 99, 98, 97, 96, etc and it just goes down to what the hp would be (75) Help would be appreciated.

Animation is pretty hacky, but possible.
I personally use math.Approach and let the client slowly approach the current health value, like so:
[lua]local health = 0 – This will act as the “approacher”, moving towards the player’s current health
function HealthHUD()

local health = math.Approach( health, LocalPlayer():Health(), 12 ) -- move health towards the player's current health 
-- Last one is pixels to move per frame
-- find a speed you like 

local healthWidth = ( healthApproach /playerMaxHealth ) *healthBarMaxWidth -- calculate width as percentage of maximum

-- DRAW STUFF USEING healthWidth, or use height, whatever

hook.Add( “HUDPaint”, “HealthHUD”, HealthHUD )[/lua]
You can also use Lerp to approach the value that you want, but the first argument must be less than 1, i.e. 0.3, as Lerp approaches the value as a percentage of the current value.

If you’re going to use Lerp or math.Approach in a HUDPaint function, using something like FrameTime() as a base to approach with so it will take the same time on someone with 5 FPS and someone with 300 FPS.

If you do it that way, and say use math.Approach(number, number2, 1) it would take 60 frames to lose 60 health, and at 30FPS thats a two seconds, but at high FPS that’s only like half a second or less. If you did it something like FrameTime() * 0.1 or something like that then it would be smooth, even if you have a sudden dip in FPS.

I’ll give this a try and let you guys know the results, thanks :slight_smile:

Here’s an example with frametime

local fVisualHealth = 0

hook.Add(“HUDPaint”, “Health”, function()
fVisualHealth = Lerp(10 * FrameTime(), fVisualHealth, LocalPlayer():Health())

-- red

-- padding of 16 pixels
-- anchored to bottom left
-- width of 256 pixels at full health
-- height of 16 pixels
surface.DrawRect(16, ScrH() - 32, 256 * (fVisualHealth / 100), 16)