Help with a HUD

So this is probably horrible code but I’m trying, I’ve just started recently. So i have my HUD working on my screen as of now, but when i switch my resolution i lose 2 pieces of my hud, the vgui.Create the users steam picture and my health icon. Here is the code.


function hud()



draw.RoundedBox(5, 20, ScrH() - 180, 210, 160, Color(128,128,128,255))
draw.RoundedBox(5, 25, ScrH() - 175, 200, 150, Color(128,206,232,200))

local health = LocalPlayer():Health()
local Player = LocalPlayer():GetUserGroup()
local armor = LocalPlayer():Armor()
local width = (health * 1.0)


draw.RoundedBox(5, 120, ScrH() - 140, 100, 15, color_white)
if width > 5 then
draw.RoundedBox(5, 120, ScrH() - 120 - 20, width, 15, Color(255,0,0,255))
end
draw.SimpleText(health, "default", 160, ScrH() - 99 - 40, Color(255,255,255,255))
draw.SimpleText("Health", "Ammo", 140, ScrH() - 130 - 40, Color(255,255,255,255))
draw.SimpleText(Player, "TargetID", 35, ScrH() - 40 - 40, Color(255,255,255,255))
draw.SimpleText(armor, "default", 160, ScrH() - 60 - 40, Color(255,255,255,255))


draw.SimpleText(LocalPlayer():Nick(),"TargetID", 15 + 30,ScrH() - 165, Color(255,255,255), TEXT_ALIGN_LEFT, TEXT_ALIGN_TOP)

local Avatar = vgui.Create( "AvatarImage", Panel )
Avatar:SetSize( 65, 64 )
Avatar:SetPos( ScrW() - 1875, ScrH() - 147)
Avatar:SetPlayer( LocalPlayer(), 60 )


surface.SetMaterial(Material("icon16/heart.png"))
surface.DrawTexturedRect( ScrW() - 1715, ScrH() - 165, 16, 16 ) 

end

local Avatar = vgui.Create( "AvatarImage", Panel )
local heart = Material("icon16/heart.png")

hook.Add("HUDPaint", "Cozz", hud)

function hidehud(name)
		for k, v in pairs({"CHudHealth", "CHudBattery"}) do
				if name == v then return false end
		end
end

hook.Add("HUDShouldDraw", "HideOurHud", hidehud)

surface.CreateFont("Ammo",
				{
				font = "TargetID",
				size = 25,
				weight = 400,
				})


I’ve been reciving some help but there is some stuff i dont get the chance to figure out.

Don’t do ScrH and ScrW - 140 or whatever.

Do ScrH/2 +/- whatever and work from there. Always divide it if you want it to be dynamic. By which number is up to you.

Doing /2 will bring it to the middle of the screen depending if you use H or W.

Edit* Actually since you are making a hud you would want it to be on the bottom. Use functions that have enums that allows you to set the general area of where it should be. (Bottom, Top, Left, Right, Etc)

[editline]7th January 2017[/editline]

I did


Avatar:SetPos( ScrW() / 43, ScrH() / 2 + 395)

I ligned it up with my 1st moniter then switched resolution to the size of my second and it did make a new one it was just too low.

Like I stated. Don’t do that for the Hud. Use Enums.

Why are you running this INSIDE the HUDPaint function?! That creates a panel every single frame causing huge lag! Move it outside the function

[editline]8th January 2017[/editline]

Also, what is Panel? You never even defined it, it doesn’t seem to be an actual panel

[editline]8th January 2017[/editline]

Also, you used color_white before, but you keep using



Color(255,255,255,255)


Just replace them with color_white for consistency and simplicity.

Also, you did this:



surface.SetMaterial(Material("icon16/heart.png"))


Which is very confusing as you didn’t even use the heart material variable you made before (also inside a HUDPaint hook causing lag).

Also, you did this:



local Avatar = vgui.Create( "AvatarImage", Panel )


In the middle of the code for no apparent reason.

Also, you never even drew the armor bar

[editline]8th January 2017[/editline]

I tried to clear the code up a bit:



surface.CreateFont("Ammo", {
	font = "TargetID",
	size = 25,
	weight = 400,
})

local heart = Material( "icon16/heart.png" )
local Avatar

local function hud()

	if IsValid( LocalPlayer() ) and !IsValid( avatar ) then
		Avatar = vgui.Create( "AvatarImage" )
		Avatar:SetSize( 65, 64 )
		Avatar:SetPos( ScrW() - 1875, ScrH() - 147 )
		Avatar:SetPlayer( LocalPlayer(), 60 )
	end

	draw.RoundedBox( 5, 20, ScrH() - 180, 210, 160, Color( 128, 128, 128 ))
	draw.RoundedBox( 5, 25, ScrH() - 175, 200, 150, Color( 128, 206, 232, 200 ))
	draw.RoundedBox( 5, 120, ScrH() - 140, 100, 15, color_white )
	local health = LocalPlayer():Health()
	if health > 5 then
		draw.RoundedBox( 5, 120, ScrH() - 120 - 20, health, 15, Color( 255, 0, 0 ))
	end
	
	draw.SimpleText( health, "default", 160, ScrH() - 99 - 40, color_white )
	draw.SimpleText( "Health", "Ammo", 140, ScrH() - 130 - 40, color_white )
	draw.SimpleText( LocalPlayer():GetUserGroup(), "TargetID", 35, ScrH() - 40 - 40, color_white )
	draw.SimpleText( LocalPlayer():Armor(), "default", 160, ScrH() - 60 - 40, color_white )
	draw.SimpleText( LocalPlayer():Nick(),"TargetID", 15 + 30, ScrH() - 165, color_white, TEXT_ALIGN_LEFT, TEXT_ALIGN_TOP )

	surface.SetDrawColor( color_white )
	surface.SetMaterial( heart )
	surface.DrawTexturedRect( ScrW() - 1715, ScrH() - 165, 16, 16 ) 

end

hook.Add( "HUDPaint", "Cozz", hud )

local function hidehud(name)
	for k, v in ipairs({ "CHudHealth", "CHudBattery" }) do
		if name == v then return false end
	end
end

hook.Add( "HUDShouldDraw", "HideOurHud", hidehud )


It still has the problem of the elements being in the wrong place but at least it won’t crash your game

Also, you didn’t make your functions local, which isn’t that necessary but is still a worry, so I did in the code above