gui is not fitting all the resolutions

[Dzsozi (h03)]

Hello everyone! Today I tried to make a notification thing, but my problem is that it doesn't fit all the resolutions.

A picture of my resolution (1680x1050, fits perfectly)

A picture of my friend's resolution (1360x768, in lower screen sizes it's not the same)

How can I fix this and make this fit perfectly on all resolutions? Please help.

This is how I made the guiGetScreenSize() thing:

local sx,sy = guiGetScreenSize () 
local notificationX = sx-notificationWidth-sx*(840/1024) 

Edited April 21, 2014 by Guest

[MIKI785]

You posted the same picture twice, so i can't see how it looks.

[Dzsozi (h03)]

You posted the same picture twice, so i can't see how it looks.

Sorry, edited.

[MIKI785]

Positioning to the left is relatively easy, if you want it at the center left do it like this:

local x, y = guiGetScreenSize() 
notificationX = 10 --10px from the left 
notificationY = y/notificationHeight 

[.:HyPeX:.]

Well, it also has a fail.

  
local x, y = guiGetScreenSize() 
notificationX = x*0.03 -- Pretty same effect as 10px (50px here if 1680). (10px is shit at 1680, almost unnoticable.) 
notificationY = y/notificationHeight 
  

Anyways, 10px at 1680 would be x*0.006, but at a lower one like 800 it would be: 4.8 (not much)

[aintaro]

Hey man,

This is how you should do it :

local notificationX = (1365 / 1600) * screenWidth -- this will basicly take the position and divide it by your screen resolution your testing on and then multiply it by the screenWidth of the user 

[Dzsozi (h03)]

Thank you guys! They're working! But now I have another problem. It's the same, it's not fitting all the resolutions, but now this time it's a text.

My firend's screen:

My screen:

How can I fix this? Please help me.

A bit of the code:

local pHeight = 24 
    local middleHeight = pHeight*data.length+20 
    if middleHeight > data.maxHeight-128-32 then 
        middleHeight = data.maxHeight-128-32 
    end 
    local totalHeight = data.maxHeight --128+middleHeight+32 
    local contentY = sy/5.001-middleHeight/5.001 

[Mr_Moose]

It's all about basic math, then you can apply the exact same method on all GUI elements:

local sx, sy = guiGetScreenSize() 
local posXCenter = (sx-guiX)/2  -- Center of x 
local posXRight = (sx-guiX)  -- Right side 
local posXLeft = 0  -- Left side 

The same can be applied on y, another thing to remember is that all of these are relative to it's parent element, for example a button which has a GUI window as parent will have it's (0,0) point in the top left of the window, root element in this case is the screen of any player.

[tosfera]

It's all about basic math, then you can apply the exact same method on all GUI elements:

local sx, sy = guiGetScreenSize() 
local posXCenter = (sx-guiX)/2  -- Center of x 
local posXRight = (sx-guiX)  -- Right side 
local posXLeft = 0  -- Left side 

The same can be applied on y, another thing to remember is that all of these are relative to it's parent element, for example a button which has a GUI window as parent will have it's (0,0) point in the top left of the window, root element in this case is the screen of any player.

Jesus, thank you! I thought we lost people with knowledge on this forum. Using math in your size and positions is the only way to make them "responsive". Like we call it in the Web development world.

[.:HyPeX:.]

Well guys, you're still missing a point on texts, its scale:

This will not be exact, and it will be small in smaller resolutions, but it will fit.

  
local x,y = guiGetScreenSize() 
ScaleFix = (1680 / x ) * (1050 / y ) 
dxDrawText("TexT", PosX, PosY, EndX, EndY, color, Scale / ScaleFix) 
  

This will make it fit in all the resolutions, just remember to edit the original values to the screen where you did the text. (This is in your case).

In the end:

  
local x,y = 1360,768 
ScaleFix = (1680 / x ) * (1050 / y ) 
dxDrawText("TexT", PosX, PosY, EndX, EndY, color, 2 / ScaleFix) 
--ScaleFix = 1.68 
--RealScale in actual resolution = 2 / 1.68 = 1.19