[TUT] How to create Graphical User Interface [GUI] and upscaling

[Bekao]

 

Hello, at the beginning, welcome to this tutorial created for amateurs who are unable to create their GUI and scale it properly to all resolutions
 

To create a GUI, we need 4 arguments that will diversify our GUI
 

Spoiler

https://wiki.multitheftauto.com/wiki/DxDrawImage
https://wiki.multitheftauto.com/wiki/DxDrawRectangle
https://wiki.multitheftauto.com/wiki/DxDrawText

 

Of course, the above-mentioned functions only work on the client side of the server, it will not work and now I will give you my way to scale the GUI for players, the point is that players can see the same arrangement of elements as I see
 

local sW,sH = guiGetScreenSize()
local yW,yH = (sW/1920),(sH/1080)

addEventHandler("onClientRender",root,function()
dxDrawImage(yW*230,yH*420,yW*620,yH*340,"images.png")
end)
 --The image will be scaled as I see it to be visible to other players in the same way whether it is a hud or a dashboard   
-- yW*230 Moves the element right 230 units
-- yH*420 Moves the element down 430 units
-- yW*620 Sets the element width by 630 units
-- yH*340 Sets the element Height by 340 units

 

This is my first tutorial, so if there is any error, I am sorry, I tried to translate as best I can Greetings

[IIYAMA]

@Bekao

Nice first attempt.

 

You are currently skipping: screen-ratio

It might something to take a look at, since your UI will be stretched(in all directions) when other players have a different ratio. In some cases that is fine, but when you do that with an image, it will not look very nice.

 

You are also skipping: "How to create a User Interface"

An image is not a User Interface, but it can be come one with the right methods (which are not explained).

Either edit the title or add the missing information.