kHUD - My free & First ever HUD

[Sir Klutch]

Hello everyone, this is my first ever attempt in making HUD. I am fairly new to Lua, so any mistakes, tips, or hate you wanna give, please do below!

Special thanks to the following users for helping me when i got stuck;
Azure Ghosting
Velkon

[IMG]http://i65.tinypic.com/25ji9g8.png[/IMG]

[B](This HUD [U][I]above[/I][/U] is discontinued, but once i figure out how to make it fit for all resolutions i'll apply that fix.)[/B]
[B]Code for the HUD[/B]
[url]https://gist.github.com/anonymous/6a6a0b95422f6002b776ef79b64e10c8[/url]

••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••

[B]HUD V2[/B]
- Not to much of a difference, i need some assistance with making it fit all resolutions and make the text not go outside the box(Maybe get smaller by text length? Idk)... I can't seem to figure that out, but here is the code and image.
[IMG]https://i.imgsafe.org/d33c428548.gif[/IMG]

--Config
 
local community_nameBlinkingText = "www.Face"
local community_name = "punch.com"
 
local health_mat = Material( "icon16/heart.png" )
local armor_mat = Material( "icon16/shield.png" )
local money_mat = Material( "icon16/money.png" )
local salary_mat = Material( "icon16/money_dollar.png" )
 
local colors = {}
colors.Base = Color(36, 36, 36, 255)
colors.HealthBar = Color(255, 0, 0, 255)
colors.HealthEmpty = Color(129, 0, 0, 255)
colors.ArmorBar = Color(0, 0, 255, 255)
colors.ArmorEmpty = Color(0, 0, 129, 255)
colors.MiscBars = Color(15, 15, 15, 220)
 
------------------------------------------------
local Health = LocalPlayer():Health()
local Armor = LocalPlayer():Armor()
local Money = string.Comma( LocalPlayer( ):getDarkRPVar( "money" ) )
 
 
surface.CreateFont("kHUDV2_Com", {
    font = "Trebuchet24", -- Use the font-name which is shown to you by your operating system Font Viewer, not the file name
    extended = false,
    size = 30,
    weight = 500,
    blursize = 1,
    scanlines = 0,
    antialias = true,
    underline = false,
    italic = false,
    strikeout = false,
    symbol = false,
    rotary = false,
    shadow = false,
    additive = false,
    outline = false,
} )
 
surface.CreateFont("kHUDV2_", {
    font = "Trebuchet24", -- Use the font-name which is shown to you by your operating system Font Viewer, not the file name
    extended = false,
    size = 40,
    weight = 500,
    blursize = 0,
    scanlines = 0,
    antialias = true,
    underline = false,
    italic = false,
    strikeout = false,
    symbol = false,
    rotary = false,
    shadow = false,
    additive = false,
    outline = false,
} )
 
surface.CreateFont("kHUDV2__", {
    font = "Trebuchet24", -- Use the font-name which is shown to you by your operating system Font Viewer, not the file name
    extended = false,
    size = 35,
    weight = 500,
    blursize = 0,
    scanlines = 0,
    antialias = true,
    underline = false,
    italic = false,
    strikeout = false,
    symbol = false,
    rotary = false,
    shadow = false,
    additive = false,
    outline = false,
} )
 
surface.CreateFont("kHUDV2___", {
    font = "Trebuchet24", -- Use the font-name which is shown to you by your operating system Font Viewer, not the file name
    extended = false,
    size = 25,
    weight = 500,
    blursize = 0,
    scanlines = 0,
    antialias = true,
    underline = false,
    italic = false,
    strikeout = false,
    symbol = false,
    rotary = false,
    shadow = false,
    additive = false,
    outline = false,
} )
 
surface.CreateFont("kHUDV2____", {
    font = "Trebuchet24", -- Use the font-name which is shown to you by your operating system Font Viewer, not the file name
    extended = false,
    size = 30,
    weight = 500,
    blursize = 0,
    scanlines = 0,
    antialias = true,
    underline = false,
    italic = false,
    strikeout = false,
    symbol = false,
    rotary = false,
    shadow = false,
    additive = false,
    outline = false,
} )
 
 
hook.Add("HUDPaint","My Hud Attempt2", function()
    local ply = LocalPlayer()
    local alive = ply:Alive()
    local lerptime = FrameTime() * 10
    Health = math.floor(Lerp( lerptime, Health, alive and ply:Health() or 0 ) )
    Armor = math.floor(Lerp( lerptime, Armor, alive and ply:Armor() or 0 ) )
    Money = string.Comma( ply:getDarkRPVar( "money" ) )
 
 
local _xy = {}
 
    _xy.baseHudX = ScrH() - 250
 
    _xy.healthBarX = ScrH() - 250
 
    _xy.ArmorBarX = ScrH() - 212
 
    _xy.miscBarX = ScrH() - 100
    _xy.miscBarX2 = ScrH() - 65
 
 
 
local _wh = {}
    _wh.baseHudW = ScrW() * 0.292
    _wh.baseHudH = ScrH() * 0.244
 
    _wh.healthBarW = ScrW() * 0.292
    _wh.healthBarH = ScrH() * 0.04
 
    _wh.ArmorBarW = ScrW() * 0.292
    _wh.ArmorBarH = ScrH() * 0.04
 
    _wh.miscBarW = ScrW() * 0.291
    _wh.miscBarH = ScrH() * 0.035
 
   
    draw.RoundedBox(5,0,_xy.baseHudX,_wh.baseHudW,_wh.baseHudH,colors.Base) --Base of HUD
 
    draw.RoundedBox(10,0,_xy.healthBarX,_wh.healthBarW,_wh.healthBarH,colors.HealthEmpty) -- Health Bar Empty
    draw.RoundedBox(10,0,_xy.healthBarX,math.Clamp( Health * 5, 0, 467 ),35,colors.HealthBar) -- Health
 
    draw.RoundedBox(10,0,_xy.ArmorBarX,_wh.ArmorBarW,_wh.ArmorBarH,colors.ArmorEmpty) -- Armor Bar Empty
    draw.RoundedBox(10,0,_xy.ArmorBarX,math.Clamp( Armor * 5, 0, 467 ),35,colors.ArmorBar) -- Armor
 
    draw.RoundedBox(10,0,_xy.miscBarX,_wh.miscBarW,_wh.miscBarH,colors.MiscBars) -- Misc Name
    draw.RoundedBox(10,0,_xy.miscBarX2,_wh.miscBarW,_wh.miscBarH,colors.MiscBars) -- Misc Name
 
 
 
 
 
local _textwh = {}
 
    _textwh.textWidth1 = ScrW() * 0.056
    _textwh.textHeight1 = ScrH() * 0.93
 
    _textwh.textWidth2 = ScrW() * 0.130
    _textwh.textHeight2 = ScrH() * 0.93
 
    _textwh.textWidth3 = ScrW() * 0
    _textwh.textHeight3 = ScrH() * 0.72
 
    _textwh.textHeight4 = ScrH() * 0.76
 
    _textwh.textWidth5 = ScrW() * 0.100
    _textwh.textHeight5 = ScrH() * 0.82
 
    _textwh.textWidth6 = ScrW() * 0.128
    _textwh.textHeight6 = ScrH() * 0.86
 
    _textwh.textWidth7 = ScrW() * 0.115
    _textwh.textHeight7 = ScrH() * 0.89
 
 
 
    draw.SimpleText(community_nameBlinkingText,"kHUDV2_Com",_textwh.textWidth1,_textwh.textHeight1,gColor,TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText(community_name,"kHUDV2_Com",_textwh.textWidth2,_textwh.textHeight2,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
 
    draw.SimpleText(" " ..Health.. "%","kHUDV2_",_textwh.textWidth3,_textwh.textHeight3,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText(" " ..Armor.. "%","kHUDV2_",_textwh.textWidth3,_textwh.textHeight4,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText("  "..Money,"kHUDV2__",_textwh.textWidth5,_textwh.textHeight5,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText("(" ..LocalPlayer():getDarkRPVar("salary").. "$)","kHUDV2___",_textwh.textWidth6,_textwh.textHeight6,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText(LocalPlayer():getDarkRPVar("job"),"kHUDV2____",_textwh.textWidth7,_textwh.textHeight7,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
 
 
--Health Image--
local Hx = ScrH() * 0.480
local Hy = ScrW() * 0.409
local Hw = 30
local Hh = 30
 
--Armor Image--
local Ax = ScrH() * 0.480
local Ay = ScrW() * 0.432
local Aw = 30
local Ah = 30
 
--Salary Image--
local Mx = ScrH() * 0.205
local My = ScrW() * 0.487
local Mw = 18
local Mh = 18
 
--Money Image--
local Sx = ScrH() * 0.175
local Sy = ScrW() * 0.465
local Sw = 23
local Sh = 23
 
 
 
    surface.SetDrawColor(255, 255, 255, 255)
    surface.SetMaterial( health_mat )
    surface.DrawTexturedRect(Hx, Hy, Hw, Hh)
 
    surface.SetMaterial( armor_mat )
    surface.DrawTexturedRect(Ax, Ay, Aw, Ah)
 
    surface.SetMaterial( money_mat )
    surface.DrawTexturedRect(Mx, My, Mw, Mh)
 
    surface.SetMaterial( salary_mat )
    surface.DrawTexturedRect(Sx, Sy, Sw, Sh)
 
end )
 
 
 
timer.Create( "Flicker", 2, 0, function()
   
    gColor 

[Zufeng]

This is pretty neat one

[c👌de_g🎷]

I really appreciate your small but informative design. Great job for your first HUD. A few things on the code:

	draw.RoundedBox(8, 9.5, 645, x / 100*30, y / 100*20, Color(31, 31, 31, 255)) --armorbox
	draw.RoundedBox(8, 9.5, 645, math.Clamp( Armor * 7.17, 0, 408 ), 35, Color(0, 93, 255, 255)) --armorbox2

	draw.RoundedBox(8, 9.5, 700, 180, 35, Color(0, 0, 0, 200)) --moneybox

	draw.RoundedBox(8, 237, 700, 180, 35, Color(0, 0, 0, 200)) --salarybox

	draw.RoundedBox(8, 237, 730, 180, 35, Color(0, 0, 0, 200)) --rpnamebox

	draw.RoundedBox(8, 9.5, 730, 180, 35, Color(0, 0, 0, 200)) --jobbox

	--draw.SimpleText(community_name, "kHUD_Font1", 0, 555, Color(255,255,255), TEXT_ALIGN_LEFT, TEXT_ALIGN_TOP)
	draw.SimpleText(Health.. "%","kHUD_Font",x / 100*4, y / 100*79,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
	draw.SimpleText(Armor.. "%","kHUD_Font",x / 100*4, y / 100*84.5,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
	draw.SimpleText("     Wallet: " ..Money.. "$","kHUD_Font3",9.5,706,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
	draw.SimpleText("   Alias: " ..rpname,"kHUD_Font2",x / 100*1.5,y / 100*96,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText("   Salary: " ..LocalPlayer():getDarkRPVar("salary").. "$","kHUD_Font2",x / 100*19.5,y / 100*91.7,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)
    draw.SimpleText("   Job: " ..LocalPlayer():getDarkRPVar("job"),"kHUD_Font2",x / 100*19.5,y / 100*96,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)

You can cache the color objects outside the hook.

if ( LocalPlayer():Alive() and wasDead ) then
		wasDead = false
			Health = 100
	elseif ( not LocalPlayer():Alive() ) then
		wasDead = true
			Health = 0
end

You should apply this to the final result instead of the previous:

hook.Add("HUDPaint","My Hud Attempt", function()
	local ply = LocalPlayer()
	local alive = ply:Alive()
	local lerptime = FrameTime() * 10
	Health = math.floor(Lerp( lerptime, Health, alive and ply:Health() or 0 ) )
	Armor = math.floor(Lerp( lerptime, Armor, alive and ply:Armor() or 0 ) )
	Money = string.Comma( ply:getDarkRPVar( "money" ) )

Also, you should not cache SrcH and ScrW as they could change if the player changes their resolution.

[Sir Klutch]

Thanks! I greatly appreciate the help. I attempted to scale everything so it didn't go off the screen. It didn't work. So, if it is because i cached the ScrH() & ScrW() then it for sure should be fixed tomorrow. I'm heading to bed, thanks for the positive feedback.

[AwPanda]

Looks good for your first hud mate :goodjob:

[Tupac]

Love the simple yet good-looking design ;)

a lot better than my first hud ;(

[IMG]http://oi63.tinypic.com/2nst5d2.jpg[/IMG]

[Skere_]

Health and armor are not percentages here. You should either divide them by their maximum, or remove the %, since this can be confusing.

[YoutoYokodera]

This look like default hud overhaul, nice job <3

[Sir Klutch]

[QUOTE=Skere_;51244312]Health and armor are not percentages here. You should either divide them by their maximum, or remove the %, since this can be confusing.[/QUOTE]

What? Why would I divide them, why should I remove the %, and how can it be confusing?

[QUOTE=YoutoYokodera;51244505]This look like default hud overhaul, nice job <3[/QUOTE]

Yeah, but i'll eventually get around to making it look more advanced. As i have already stated, this is my first attempt. Appreciate the positive feedback!!

[Mijyuoon]

[QUOTE=Sir Klutch;51244920]What? Why would I divide them, why should I remove the %, and how can it be confusing?[/QUOTE]

Because you aren't displaying percentage. Percent sign means it's a ratio of current value to maximum value that normally ranges from 0 (current = 0) to 100 (current = maximum).

[Skere_]

[QUOTE=mijyuoon;51245209]Because you aren't displaying percentage. Percent sign means it's a ratio of current value to maximum value that normally ranges from 0 (current = 0) to 100 (current = maximum).[/QUOTE]

Exactly, not sure why everyone is rating it dumb tho, its not hard to understand how percentages work.

[Sir Klutch]

[QUOTE=mijyuoon;51245209]Because you aren't displaying percentage. Percent sign means it's a ratio of current value to maximum value that normally ranges from 0 (current = 0) to 100 (current = maximum).[/QUOTE]

Ahh, thanks for the thorough explanation!

[YoutoYokodera]

Is it support hunger?

[Sir Klutch]

[QUOTE=YoutoYokodera;51246398]Is it support hunger?[/QUOTE]

No, i'll get around to adding the hunger mod though if you'd like? I'll make a config for it.

Also, some challenges would be nice guys! Tell me what to do with this current HUD and i'll give it a shot.

[YoutoYokodera]

Make the space between the bars and the info panel transparent?
Idk, I just think it will look better

[lubatron]

This is incredible for your first time dude.
Goodjob!

[Sir Klutch]

[QUOTE=lubatron;51248002]This is incredible for your first time dude.
Goodjob![/QUOTE]

Thanks! Done quite a few changes to this HUD. Will try to release tonight.

[Sir Klutch]

-Updated

[QUOTE=code_gs;51243140]
Also, you should not cache SrcH and ScrW as they could change if the player changes their resolution.[/QUOTE]

I cannot seem to figure out how to use ScrH and ScrW so interfaces and text do not move when you change resolution. Could you please give me an example? I placed them inside the hook and this is what it looks like moving to my smallest resolution.

[url]http://steamcommunity.com/sharedfiles/filedetails/?id=786242554[/url]

[c👌de_g🎷]

[QUOTE=Sir Klutch;51250207]-Updated

I cannot seem to figure out how to use ScrH and ScrW so interfaces and text do not move when you change resolution. Could you please give me an example? I placed them inside the hook and this is what it looks like moving to my smallest resolution.

[url]http://steamcommunity.com/sharedfiles/filedetails/?id=786242554[/url][/QUOTE]

Can you post your code?

[Sir Klutch]

[QUOTE=code_gs;51250480]Can you post your code?[/QUOTE]

It's already in the thread, but here you go.
[url]https://gist.github.com/anonymous/d0f2551ebb583d98eab127cffab244f2[/url]

[c👌de_g🎷]

[QUOTE=Sir Klutch;51250517]It's already in the thread, but here you go.
[url]https://gist.github.com/anonymous/d0f2551ebb583d98eab127cffab244f2[/url][/QUOTE]

That code is with SrcH and SrcW cached; can you post the version with them implemented in the hook?

[Sir Klutch]

[QUOTE=code_gs;51250528]That code is with SrcH and SrcW cached; can you post the version with them implemented in the hook?[/QUOTE]

I thought since i had it out side of the hook and not in it like this below is what you were talking about, clearly i've mistaken. A little help? Lol

hook.Add("HUDPaint", "Bleh", function()

draw.RoundedBox(10,0,ScrH() - 250,ScrW() * 0.292,ScrH() * 0.04,colors.HealthEmpty) 

end )

[editline]24th October 2016[/editline]

Do you mean like

local Sx = ScrH() * 0.175
	local Sy = ScrW() * 0.465
	local Mx = ScrH() * 0.205
	local My = ScrW() * 0.487

Inside of the hook?

[c👌de_g🎷]

[QUOTE=Sir Klutch;51250557]I thought since i had it out side of the hook and not in it like this below is what you were talking about, clearly i've mistaken. A little help? Lol

hook.Add("HUDPaint", "Bleh", function()

draw.RoundedBox(10,0,ScrH() - 250,ScrW() * 0.292,ScrH() * 0.04,colors.HealthEmpty) 

end )

[editline]24th October 2016[/editline]

Do you mean like

local Sx = ScrH() * 0.175
	local Sy = ScrW() * 0.465
	local Mx = ScrH() * 0.205
	local My = ScrW() * 0.487

Inside of the hook?[/QUOTE]

Yes. You can store the numerical constants outside of the hook if you wish, but any ScrW/ScrH result modifiers should be done inside the hook.

[Sir Klutch]

[QUOTE=code_gs;51250933]Yes. You can store the numerical constants outside of the hook if you wish, but any ScrW/ScrH result modifiers should be done inside the hook.[/QUOTE]

Okay, is this correct? HUD still seems to be all screwy when resolution is changed from my highest to lowest.
[url]http://pastebin.com/kJw1VvaY[/url]

Also, i'm receiving this error and i believe it has something to do with the way getDarkRPVar is returning(From what i've been looking up, but found no solution.)

Code:

draw.SimpleText("(" ..LocalPlayer():getDarkRPVar("salary").. "$)","kHUDV2___",_textwh.textWidth6,_textwh.textHeight6,Color(255,255,255),TEXT_ALIGN_LEFT,TEXT_ALIGN_TOP)

Error:

[ERROR] addons/darkrpmodification-master/lua/darkrp_modules/hudreplacement/cl_hudreplacement.lua:199: attempt to concatenate a nil value
  1. fn - addons/darkrpmodification-master/lua/darkrp_modules/hudreplacement/cl_hudreplacement.lua:199
   2. unknown - addons/ulib-master/lua/ulib/shared/hook.lua:109

[Skere_]

[QUOTE=code_gs;51250933]Yes. You can store the numerical constants outside of the hook if you wish, but any ScrW/ScrH result modifiers should be done inside the hook.[/QUOTE]

Just wondering, why should the result modifiers be done inside the hook? Aren't they constant as well?

[c👌de_g🎷]

[QUOTE=Skere_;51253035]Just wondering, why should the result modifiers be done inside the hook? Aren't they constant as well?[/QUOTE]

I was referring to the Scr functions as the modifiers. Poor wording on my part

[Sir Klutch]

Still need help with scaling if anyone could assist me please.