GUI size

[IIYAMA]

I am a starter at gui's.

The problem is that everybody has it's own resolution. But when I check the function "GuiCreateWindow" there are some values to fill in. x and y for position, width and height.

https://wiki.multitheftauto.com/wiki/GuiCreateWindow

The big problem is that I don't know what the width and height values are.

%?, pixel?(72dpi), well I don't know what I must think of this.....

Ws, Hs= guiGetScreenSize()

outputChatBox( Ws .. " " .. HS) -- 1920 1080

[csiguusz]

As well as positions, size can be relative or absolute, you can set this with the last argument of guiCreateWindow.

If it's relative, the size ( and the positions ) should be beetwen 0 and 1. This is relative to any resolution and actually position can be counted so: screenWidht*relative_gui_widht (and so with height and positions of course). 0 at sizes is 0 and 1 is equal to the screen's width or height.

For example 0.5 is half of the screens height or width. If you use 0.5 as relative width on your resolutin (1920x1080) the window's width will be 1920*0.5=960. On 1024x768 the same window's width would be 1024*0.5=512.

Absolute sizes are in pixels.

If you want a 50 width window with absolute sizes, then you have to use 50 as width and so on...

I hope this helps.

[Anderl]

You can also use this formula:

local screenX, screenY, px, py, width, height = guiGetScreenSize(); 
  
px      = (     %ELE_ABSX%      /   %RESWIDTH_USED%     ) * screenX; 
py      = (     %ELE_ABSY%      /   %RESHEIGHT_USED%    ) * screenY; 
width   = (     %ELE_WIDTH%     /   %RESWIDTH_USED%     ) * screenX; 
height  = (     %ELE_HEIGHT%    /   %RESHEIGHT_USED%    ) * screenY;  
  
--[[ 
  
%ELE_ABSX%          = Absolute position X of the element; 
%ELE_ABSY%          = Absolute position Y of the element; 
%ELE_WIDTH%         = Width of your element; 
%ELE_HEIGHT%        = Height of your element; 
%RESWIDTH_USED%     = Width of the screen used to find the absolute positions of the element;  
%RESHEIGHT_USED%    = Height of the screen used to find the absolute positions of the element;]] 

You might want to use this principally if you use GUIEditor to create your GUI elements.

[PaiN^]

You can also use this formula:

local screenX, screenY, px, py, width, height = guiGetScreenSize(); 
  
px      = (     %ELE_ABSX%      /   %RESWIDTH_USED%     ) * screenX; 
py      = (     %ELE_ABSY%      /   %RESHEIGHT_USED%    ) * screenY; 
width   = (     %ELE_WIDTH%     /   %RESWIDTH_USED%     ) * screenX; 
height  = (     %ELE_HEIGHT%    /   %RESHEIGHT_USED%    ) * screenY;  
  
--[[ 
  
%ELE_ABSX%          = Absolute position X of the element; 
%ELE_ABSY%          = Absolute position Y of the element; 
%ELE_WIDTH%         = Width of your element; 
%ELE_HEIGHT%        = Height of your element; 
%RESWIDTH_USED%     = Width of the screen used to find the absolute positions of the element;  
%RESHEIGHT_USED%    = Height of the screen used to find the absolute positions of the element;]] 

You might want to use this principally if you use GUIEditor to create your GUI elements.

Can you but it in an example please .

[Anderl]

I guess the example was pretty clear, you only need to change the vars ( the ones who use % in the start and end ) with the right values. I even explained below what each one meant, in case someone didn't know. However, I'll give you an example:

local screenX, screenY = guiGetScreenSize(); 
  
guiCreateStaticImage ( ( 392 / 800 ) * screenX, ( 428 / 600 ) * screenY, ( 500 / 800 ) * screenX, ( 500 / 600 ) * screenY, "mypicture.png", false ); 

[IIYAMA]

Thank you all,

Now I understand how it works.

@Anderl

yes, Gui editor is really nice. For the design them I will use Indesign. /me IIYAMA love adobe.

[csiguusz]

You are welcome.

[PaiN^]

I think i got it, little more practicing and all should be good .

Thank you very much Anderl

[Anderl]

You're welcome ( both ).