Custom DarkRP HUD not appearing in the right place

[wizard man]

I made a custom DarkRP HUD from scratch today, I think I did well. But this issue only happens to other people, but not me.

Here's my POV:

https://files.facepunch.com/forum/upload/444096/205d0ee2-b2a3-4fff-87cb-19932a2a2e2d/20190319211454_2.jpg

Here's everyone else's POV:

https://files.facepunch.com/forum/upload/444096/13812f13-9a30-4c17-8388-ba45769b2f23/4000_screenshots_20190319211532_1.jpg

[CupCakeR]

Can't help without code.

[wizard man]

Here's the part that I did myself:

local function Base()

        --Background Box--
        draw.RoundedBox(6, ScrW() - 1260 - 17, ScrH () - 150 + 27, 386, 120, Color(58, 58, 58, 255))

        --Health/Armor Background Box--
        draw.RoundedBox(3, ScrW() - 1274, ScrH () - 31, 400-20, 30 - 5, Color(33, 33, 33, 255))

        --Line--
        draw.RoundedBox(0, ScrW() - 1183, ScrH () - 85, 400-115, 30 - 27, Color(33, 33, 33, 255))

        --Health Drawing--
        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

        --Armor Drawing--
        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

        --Health Bar--
        if DrawHealth != 0 then
            draw.RoundedBox(3, ScrW() - 1274 + 2, ScrH () - 31 + 2, (400-24) * DrawHealth / 100, 30-10, Color(198, 39, 39, 255))
        end

        --Armor Bar--
        if DrawArmor != 0 then
            draw.RoundedBox(3, ScrW() - 1274 + 2, ScrH () - 31 + 17, (400-24) * DrawArmor / 100, 30-25, Color(12, 144, 201, 255))
        end

        --Info--
        draw.DrawText("$"..LocalPlayer():getDarkRPVar("salary"), "GModWorldtip", ScrW() - 700 - 230, ScrH () - 57, Color(147, 147, 147, 255))
        draw.DrawText("$"..LocalPlayer():getDarkRPVar("money"), "GModWorldtip", ScrW() - 700 - 482, ScrH () - 57, Color(147, 147, 147, 255))
        draw.DrawText(LocalPlayer():getDarkRPVar("job"), "GModWorldtip", ScrW() - 700 - 482, ScrH () - 78, Color(221, 221, 221, 255))

        --User--
        draw.DrawText(LocalPlayer():Nick(), "DermaLarge", ScrW() - 1260 + 80, ScrH () - 300 + 180, Color(209, 39, 39, 255))
        local Avatar = vgui.Create( "AvatarImage", Panel )
            Avatar:SetSize( 84, 84 )
            Avatar:SetPos( 7, 601 )
            Avatar:SetPlayer( LocalPlayer(), 64 )

end

[CupCakeR]

My guess is that you play on a different resolution.

HUD's for all screen resolutions?
HUD for different resolutions

[{tableware]

I‘m not quite sure but I think it‘s so buggy because you based the sizes and positions on your screen. Other people have other resolutions

[MostRush]

More correct use: ScrW() * (0/1920) and ScrH() * (0/1080). So you can set accurate position or size

[Rubat]

I would advise against using anything like this. Just use logic and set positions that would work across all resolutions.

You would use ScrW() - X to achor the position against the right side of the screen, which is what you are doing.

You use just X to anchor against the left side which is what you want.

Just use logic and read what the functions do.

All drawing functions coordinates start from 0,0 - the top left corner, every number from there moves the position into lower right direction.

[MostRush]

Ok, but what with size? If my materials special for FHD resolution i use my method. They can't stretch.

[Rubat]

Using fractions of ScrW() and ScrW() for size is fair game, but make sure you either math.ceil or math.floor the result for best.. results. Especially on dynamically sized objects such as progress bars and what not, or the "animation" may look jittery, most noticeable when the change is slow, or when it reaches end/start of the progress bar or whatever.

As for textures, you ought to design your UI/HUD in such a way that you either use a generic stretchable texture (a gradient of sorts), or use texture tiling and cutting to achieve best results, which also would require the texture to be tiling.

[MostRush]

got it. Thanks for detailed explanation.

[Rubat]

Also it may be a good idea to set up local variables such as x, y, w, h and use them when drawing elements to more easily control the position/size of the elements after coding them and whatnot, like in this case.

[wizard man]

I've got it all fixed now. I just needed to use multiplication/division instead of pluses and minuses.