DxDrawText universal position problem.

[koragg]

Hello people, I've got a small bug with a dxdrawing. Check the things above radar in the following picture:

The date and time are fine but the day name should be right ontop of the time drawing (not so high above it). This is how it looks on 1440x900^ and here's how it looks on 1920x1080 (and how it should look on all widely used resolutions -->

Here's the code, hope somebody can help out with positioning this thing the way it is on the second screenshot for any (or close to any) resolution. Client script below:

local sx_, sy_ = guiGetScreenSize ( )
local sx, sy = sx_/1440, sy_/900
local visible = true

function drawdatetime()
	    local hours = getRealTime().hour
        local minutes = getRealTime().minute
        local seconds = getRealTime().second
		local datestring = FormatDate("d/m/Y")
		local daystring = FormatDate("W")
		
		if visible then
		if seconds <= 9 then
			seconds = "0"..seconds
		end
		if minutes <= 9 then
			minutes = "0"..minutes
		end
		if hours <= 9 then
			hours = "0"..hours
		end
		
		dxSetAspectRatioAdjustmentEnabled(true, 4/3)
		dxDrawText(hours..":"..minutes..":"..seconds, 140*sx, 648*sy, 0*sx, 0*sy, tocolor(255,255,0,255), 0.8*sy,"bankgothic")
        dxDrawText(datestring, 142*sx, 665*sy, 0*sx, 0*sy, tocolor(255,255,0,255), 0.6*sy,"bankgothic")		
		dxDrawText(daystring, -650*sx - 1, 1038*sy - 1, 1044*sx - 1, 25*sy - 1, tocolor(255,255,0,255), 0.6*sy, "bankgothic", "center", "center", false, false, false, false, false)
	end
end
addEventHandler("onClientRender",root,drawdatetime)

function showtimedate()
		visible = true
end

function hidetimedate()
	if visible then
		visible = false
	end
end
--Edited by AleksCore & MegasXLR
function Check(funcname, ...)
    local arg = {...}
 
    if (type(funcname) ~= "string") then
        error("Argument type mismatch at 'Check' ('funcname'). Expected 'string', got '"..type(funcname).."'.", 2)
    end
    if (#arg % 3 > 0) then
        error("Argument number mismatch at 'Check'. Expected #arg % 3 to be 0, but it is "..(#arg % 3)..".", 2)
    end
 
    for i=1, #arg-2, 3 do
        if (type(arg[i]) ~= "string" and type(arg[i]) ~= "table") then
            error("Argument type mismatch at 'Check' (arg #"..i.."). Expected 'string' or 'table', got '"..type(arg[i]).."'.", 2)
        elseif (type(arg[i+2]) ~= "string") then
            error("Argument type mismatch at 'Check' (arg #"..(i+2).."). Expected 'string', got '"..type(arg[i+2]).."'.", 2)
        end
 
        if (type(arg[i]) == "table") then
            local aType = type(arg[i+1])
            for _, pType in next, arg[i] do
                if (aType == pType) then
                    aType = nil
                    break
                end
            end
            if (aType) then
                error("Argument type mismatch at '"..funcname.."' ('"..arg[i+2].."'). Expected '"..table.concat(arg[i], "' or '").."', got '"..aType.."'.", 3)
            end
        elseif (type(arg[i+1]) ~= arg[i]) then
            error("Argument type mismatch at '"..funcname.."' ('"..arg[i+2].."'). Expected '"..arg[i].."', got '"..type(arg[i+1]).."'.", 3)
        end
    end
end

local gWeekDays = { "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" }
function FormatDate(format, escaper, timestamp)
	Check("FormatDate", "string", format, "format", {"nil","string"}, escaper, "escaper", {"nil","string"}, timestamp, "timestamp")
 
	escaper = (escaper or "'"):sub(1, 1)
	local time = getRealTime(timestamp)
	local formattedDate = ""
	local escaped = false
 
	time.year = time.year + 1900
	time.month = time.month + 1
 
	local datetime = { d = ("%02d"):format(time.monthday), h = ("%02d"):format(time.hour), i = ("%02d"):format(time.minute), m = ("%02d"):format(time.month), s = ("%02d"):format(time.second), w = gWeekDays[time.weekday+1]:sub(1, 2), W = gWeekDays[time.weekday+1], y = tostring(time.year):sub(-2), Y = time.year }
 
	for char in format:gmatch(".") do
		if (char == escaper) then escaped = not escaped
		else formattedDate = formattedDate..(not escaped and datetime[char] or char) end
	end
 
	return formattedDate
end

 

[Dealman]

The bounding box for your dxDrawText is too small, so when you try and center it and will be offset like that. You don't specify width and height like you do with dxDrawRectangle, instead you specify the position of the bottom.

Edit:

To clarify, let's say your text starts at 300, 300 and you want the bounding box to be 400 pixels wide and 300 pixels "high". It would look like this;

dxDrawText("Text", 300, 300, 700, 600)

Whereas a rectangle would look like this;

dxDrawRectangle(300, 300, 400, 300)

 

Edited October 1, 2016 by Dealman

[koragg]

I get what you mean but I can't seem to do it with my script. I tried moving the value of the last number (600 in your example) but then text position moves so I have to edit the second number's value (300 in your example's case) and at the end it still looks same as in my first post.

[Dealman]

My advice would be that you get the guieditor and use that. It will visualize the bounding box for you and generate the relevant code. Keep in mind the alignment is relative to the bounding box.

Edited October 1, 2016 by Dealman

[koragg]

I actually used guieditor before to create a centered site logo at top of screen (was so long ago I forgot that resource exists ). Anyway, thanks for your help, with the following line it looks perfect on known resolutions and is fine on less known ones (like 1680x1050) as well. 

dxDrawText(daystring, sx_*0.1019, sy_*0.7051, sx_*0.1714, sy_*0.6287, tocolor(255,255,0,255), 0.6*sy, "bankgothic", "center", "top", false, false, false, false, false)