HUD Textures

Hello, I recently have been trying to code a Custom HUD, however when I add textures they just go Pink & Black.

Example:

Code:


    local ourMat = Material( "vgui/HUDDesign.png" ) -- Calling Material() every frame is quite expensive

    hook.Add( "HUDPaint", "example_hook", function()
	   surface.SetDrawColor( 255, 255, 255, 255 )
	   surface.SetMaterial( ourMat	) -- If you use Material, cache it!
	   surface.DrawTexturedRect( 20, ScrH () - 200 - 10, 400, 150 )
    end )

If anyone could help me fix this, that would be great :smiley:

Material() originates from ‘materials’.
Ergo not:


Material( "materials/vgui/HUDDesign.png" )

But:


Material( "vgui/HUDDesign.png" )

Hm, I accidently uploaded that bit, I removed it on the server files, and forgot to remove it from the file on my desktop.

Updated the code.

I have been trying to get this working for hours now.

What’s the full path to your material?

garrysmod/materials/vgui/HUDDesign.png

Well, it’s very odd that that wouldn’t work… and you’re sure the garrysmod folder is in the right file path?



C:\Program Files (x86)\Steam\SteamApps\common\GarrysMod\garrysmod


I have it on my server, but that is where it is at other than its on the D: not the C:

Try this:


hook.Add( "HUDPaint", "example_hook", function()
    surface.SetMaterial(ourMat)
    surface.DrawTexturedRect( 20, ScrH () - 200 - 10, 400, 150 )
    surface.SetDrawColor( 255, 255, 255, 255 )
end )

All I did was move surface.SetDrawColor() below the rest of the drawing script. Maybe it was trying to draw the color HUDDesign.png before it was even initialized yet.

If that doesn’t work, try moving your code under local function DrawHUD() if it’s not already there.

So it draws the textured rectangle before you even set the color of the rectangle? How is that going to help?

Worked perfect, thanks.

Damn bro, im just ---->TRYING<---- to help. Im no lua expert so don’t hate lol. I had a similar problem that I fixed, and that’s how my code was layed out.

I don’t hate you… I’m just wondering why that seems to be the working solution- I don’t understand how setting the draw color AFTER drawing a rectangle would fix it, wouldn’t the rectangle just keep the color set in the previous code calling that SetDrawColor function?

[editline]10th April 2016[/editline]

Maybe you need to set the material before setting the draw color or something

Okay, I have another problem :stuck_out_tongue:

This is my code:


local function Base()

    local ourMat = Material( "vgui/HUDDesign.png" ) -- Calling Material() every frame is quite expensive

    hook.Add( "HUDPaint", "example_hook", function()
	   surface.SetMaterial( ourMat ) -- If you use Material, cache it!
	   surface.DrawTexturedRect( 20, ScrH () - 200 - 10, 400, 150 )
	   surface.SetDrawColor( 255, 255, 255, 255 )
    end )

    --[Health Bar]--
    local DrawHealth = LocalPlayer():Health() or 0
    local EchoHealth = LocalPlayer():Health() or 0

    if DrawHealth > 100 then DrawHealth = 100 end
    if DrawHealth < 0 then DrawHealth = 0 end

    if DrawHealth != 0 then
        draw.RoundedBox(6, 33, ScrH() - 200 + 2, (400-24) * DrawHealth / 100, 30-4, Color(255,255,255,255))
    end

    --[Armour Bar]--
    local DrawArmor = LocalPlayer():Armor() or 0
    local EchoArmor = LocalPlayer():Armor() or 0

    if DrawArmor > 100 then DrawArmor = 100 end
    if DrawArmor < 0 then DrawArmor = 0 end

    if DrawArmor != 0 then
        draw.RoundedBox(6, 33, ScrH() - 175 + 2, (400-24) * DrawArmor / 100, 30 - 4, Color(0,0,255,255))
    end

    --[Text]--
    draw.DrawText( "Armour: "..EchoArmor, "CloseCaption_Bold", 33, ScrH () - 175 + 2, Color(255,255,255,255))
    draw.DrawText( "Health: "..EchoHealth, "CloseCaption_Bold", 33, ScrH () - 200 + 2, Color(255,255,255,255))
    draw.DrawText( LocalPlayer():Nick(), "AgencyFB", 33, ScrH () - 140 + 2, Color(0,255,255,255))
    draw.DrawText( "Salary: $"..LocalPlayer():getDarkRPVar( "salary" ), "AgencyFB", 33, ScrH () - 120 + 2, Color(255,255,255,255))
    draw.DrawText( "Wallet: $"..LocalPlayer():getDarkRPVar( "money" ), "AgencyFB", 33, ScrH () - 100 + 2, Color(0,255,255,255))
    draw.DrawText( "Job: "..LocalPlayer():getDarkRPVar( "job" ), "AgencyFB", 33, ScrH () - 80 + 2, Color(255,255,255,255))
    draw.DrawText( "SteamID: "..LocalPlayer():SteamID(), "AgencyFB", 33, ScrH () - 60 + 2, Color(0,255,255,255)) 

end

Basically, the Image is on top of the Text, is there a way to send the image back and the text forward?

For the HUD I made I used



draw.SimpleText


I doubt that has anything to do with it…

but I have no Idea what is wrong since I would assume it would matter on what you coded first.

EDIT:
This is what I used for materials



        local red = Material( "vgui/red.png")
        surface.SetDrawColor( 255, 255, 255, 255 )
        surface.SetMaterial( red )
        surface.DrawTexturedRect( ScrW() / 10.5, ScrH () / 1.265, health * 3.1, 47)


(This material was used for a HP bar)

This code has some significant issues, for the text to draw you will need the code including and below “–[Health Bar]–” to be inside the hook.Add.

as a rule of thumb, anything within the draw and surface libraries typically should be used within a HUDPaint hook with some exceptions such as surface.CreateFont.

Also the way the screen is drawn is in the order of the code from back to front.

This /should/ work:

[lua]
local function Base()

local ourMat = Material( "vgui/HUDDesign.png" ) -- Calling Material() every frame is quite expensive

hook.Add( "HUDPaint", "example_hook", function()
        surface.SetMaterial( ourMat ) -- If you use Material, cache it!
        surface.DrawTexturedRect( 20, ScrH () - 200 - 10, 400, 150 )
        surface.SetDrawColor( 255, 255, 255, 255 )

        --[Health Bar]--
        local DrawHealth = LocalPlayer():Health() or 0
        local EchoHealth = LocalPlayer():Health() or 0

        if DrawHealth &gt; 100 then DrawHealth = 100 end
        if DrawHealth &lt; 0 then DrawHealth = 0 end

        if DrawHealth != 0 then
            draw.RoundedBox(6, 33, ScrH() - 200 + 2, (400-24) * DrawHealth / 100, 30-4, Color(255,255,255,255))
        end

        --[Armour Bar]--
        local DrawArmor = LocalPlayer():Armor() or 0
        local EchoArmor = LocalPlayer():Armor() or 0

        if DrawArmor &gt; 100 then DrawArmor = 100 end
        if DrawArmor &lt; 0 then DrawArmor = 0 end

        if DrawArmor != 0 then
            draw.RoundedBox(6, 33, ScrH() - 175 + 2, (400-24) * DrawArmor / 100, 30 - 4, Color(0,0,255,255))
        end

        --[Text]--
        draw.DrawText( "Armour: "..EchoArmor, "CloseCaption_Bold", 33, ScrH () - 175 + 2, Color(255,255,255,255))
        draw.DrawText( "Health: "..EchoHealth, "CloseCaption_Bold", 33, ScrH () - 200 + 2, Color(255,255,255,255))
        draw.DrawText( LocalPlayer():Nick(), "AgencyFB", 33, ScrH () - 140 + 2, Color(0,255,255,255))
        draw.DrawText( "Salary: $"..LocalPlayer():getDarkRPVar( "salary" ), "AgencyFB", 33, ScrH () - 120 + 2, Color(255,255,255,255))
        draw.DrawText( "Wallet: $"..LocalPlayer():getDarkRPVar( "money" ), "AgencyFB", 33, ScrH () - 100 + 2, Color(0,255,255,255))
        draw.DrawText( "Job: "..LocalPlayer():getDarkRPVar( "job" ), "AgencyFB", 33, ScrH () - 80 + 2, Color(255,255,255,255))
        draw.DrawText( "SteamID: "..LocalPlayer():SteamID(), "AgencyFB", 33, ScrH () - 60 + 2, Color(0,255,255,255))
end )

end
[/lua]

I’d also advise against calling a function “Base” due to similar variable names in the core gmod which could cause problems.

Out of curiosity how or why are you wrapping this code in a function? You shouldn’t need to do this in most cases.

In game I have this: https://gyazo.com/d3dfa3f88e239b06b0fed7cfd6dad9ac

The picture only works if you look at a ‘world’ prop

Edit: I made a few changes



local function Base()

    local ourMat = Material( "vgui/HUDDesign.png" ) -- Calling Material() every frame is quite expensive

    hook.Add( "HUDPaint", "example_hook", function()
            surface.SetMaterial( ourMat ) -- If you use Material, cache it!
            surface.DrawTexturedRect( 20, ScrH () - 200 - 10, 400, 150 )
            surface.SetDrawColor( 255, 255, 255, 255 )

            --[Health Bar]--
            local DrawHealth = LocalPlayer():Health() or 0
            local EchoHealth = LocalPlayer():Health() or 0

            if DrawHealth > 100 then DrawHealth = 100 end
            if DrawHealth < 0 then DrawHealth = 0 end

            if DrawHealth != 0 then
                draw.RoundedBox(6, 33, ScrH() - 200 + 2, (400-24) * DrawHealth / 100, 30-4, Color(255,0,0,255))
            end

            --[Armour Bar]--
            local DrawArmor = LocalPlayer():Armor() or 0
            local EchoArmor = LocalPlayer():Armor() or 0

            if DrawArmor > 100 then DrawArmor = 100 end
            if DrawArmor < 0 then DrawArmor = 0 end

            if DrawArmor != 0 then
                draw.RoundedBox(6, 33, ScrH() - 175 + 2, (400-24) * DrawArmor / 100, 30 - 4, Color(0,0,255,255))
            end

            --[Text]--
            draw.DrawText( "Health: "..EchoHealth, "CloseCaption_Bold", 33, ScrH () - 200 + 2, Color(255,255,255,255))
            draw.DrawText( "Armour: "..EchoArmor, "CloseCaption_Bold", 33, ScrH () - 175 + 2, Color(255,255,255,255))
            draw.DrawText( LocalPlayer():Nick(), "AgencyFB", 33, ScrH () - 150 + 2, Color(0,255,255,255))
            draw.DrawText( "Salary: $"..LocalPlayer():getDarkRPVar( "salary" ), "AgencyFB", 33, ScrH () - 135 + 2, Color(0,255,255,255))
            draw.DrawText( "Wallet: $"..LocalPlayer():getDarkRPVar( "money" ), "AgencyFB", 33, ScrH () - 120 + 2, Color(0,255,255,255))
            draw.DrawText( "Job: "..LocalPlayer():getDarkRPVar( "job" ), "AgencyFB", 33, ScrH () - 105 + 2, Color(0,255,255,255))
            draw.DrawText( "SteamID: "..LocalPlayer():SteamID(), "AgencyFB", 33, ScrH () - 90 + 2, Color(0,255,255,255))
    end )

end


[editline]11th April 2016[/editline]

Fixed.