dxDrawText font size

[Hale]

Hi, I've been trying to scale drawn text (dxDrawText) to make it look nice for every resolution, however, every time I do so the text looks awfully blur and barely readable in lower resolutions (such as 640x480). Here's an example of what I'm trying to say:

1280x1024

 

640x480

 

Any ideas on how to do this properly? By the way, I'm using "default-bold" MTA font so the problem is not in a custom font.

[#BrosS]

before the font argument you find scale

[Hale]

55 minutes ago, #BrosS said:

before the font argument you find scale

Please read my post again, I said I am scaling it by using screenWidth/1280*scale but it blurs the text and makes it unreadable. Any other ideas?

[coNolel]

4 minutes ago, Hale said:

Please read my post again, I said I am scaling it by using screenWidth/1280*scale but it blurs the text and makes it unreadable. Any other ideas?

screenWidth/1280*scale

1280 is your screenWidth , right ?

So

use sX as a variable for screenWidth

not sure but 

sX  = guiGetScreenSize()

kekscale = screenWidth/sX*scale

 

[Hale]

2 minutes ago, coNolel said:

screenWidth/1280*scale

1280 is your screenWidth , right ?

So

use sX as a variable for screenWidth

not sure but 

sX  = guiGetScreenSize()

kekscale = screenWidth/sX*scale

 

screenWidth is sX, I just put it as an example.. Reason why I'm dividing screen width with 1280 is because in 1280x1024 resolution the drawn text looks as it should, so for example:

sX=1920

sY/1280*scale=1920/1280*1=1.5

Which means the text will be drawn bigger as the resolution is also bigger and that's fine, but not when it comes to smaller resolutions as seen in provided picture.

[#BrosS]

sx,sy = guiGetScreenSize()
scale = (sx/1920)*(sy/1280)

use it like that

[Hale]

10 hours ago, #BrosS said:

sx,sy = guiGetScreenSize()
scale = (sx/1920)*(sy/1280)

use it like that

The text is still blurred, the same thing as before.

[Jayceon]

-- Use custom font and set antialiased.

dxCreateFont("path.format", size, false, "antialiased") -- for me work all times very good with my responsive multiplier

 

[Hale]

On 6/16/2017 at 13:06, Jayceon said:

-- Use custom font and set antialiased.

dxCreateFont("path.format", size, false, "antialiased") -- for me work all times very good with my responsive multiplier

 

That didn't really help either. I "kinda" found a solution, here's what I did:
 

local x, y = guiGetScreenSize()
if x > 1000 then -- if the resolution is decent enough, create the nice font
	font = dxCreateFont(":race/addons/font.ttf",12*(x/1280))
else -- if the resolution is low, create a PIXEL font that can be somewhat readable (although ugly)
	font = dxCreateFont(":race/addons/font-low.ttf",12*(x/1280), false, "antialiased")
end

If anyone has a better solution, please help a man out!

[IIYAMA]

?font = dxCreateFont(":race/addons/font.ttf",math.max(12*(x/1280), 8))

You can set an under limit.

Custom fonts on low resolutions are indeed an problem. I also haven't solved that problem yet.

 

[Hale]

3 hours ago, IIYAMA said:

?font = dxCreateFont(":race/addons/font.ttf",math.max(12*(x/1280), 8))

You can set an under limit.

Custom fonts on low resolutions are indeed an problem. I also haven't solved that problem yet.

 

My goal was to make all drawings the same size on every resolution, however, it doesn't really seem possible. I also tried using MTA "default-bold" and "default" fonts, with which I had the same problem as using the custom ones (weirdly enough)...

[IIYAMA]

local fonts = {}
local scalingPercentagePerSample = 0.05 -- 5%
local samplesCount = 10

-- samplesCount validate --
if samplesCount / 2 ~= math.floor(samplesCount/2) then
	samplesCount = samplesCount+1
end
---------------------------


function dxCreateSamplesForFont (filepath, size)
	local _, screenY = guiGetScreenSize() 
	local samples = {}
	for sampleScaleMultiplier=1, samplesCount do 
		sampleScaleMultiplier = sampleScaleMultiplier - samplesCount/2
		local newSize = size * (screenY/1024) - (size * (screenY/1024) * (sampleScaleMultiplier * scalingPercentagePerSample))
		iprint("newSize:", newSize)
		local font = dxCreateFont(filepath, newSize)
		samples[#samples+1] = {newSize, font}
	end
	return samples
end


fonts[":race/addons/font.ttf"] = dxCreateSamplesForFont (":race/addons/font.ttf", 10)

And if you create samples?

 

Edited June 18, 2017 by IIYAMA

[koragg]

I did this to around 90% of my server's dxDrawText stuff. I guess you can't really make it look good on ANY resolution. But c'mon: who'll play on 640x480 lol

If you make it look ok and readable down to 1280x720 then that's perfect. It's 2017 with 4k screens and you worry about a 480p one  Output a message to users which are on a resolution below HD that they need to up it a bit if they want to enjoy your server.

[Hale]

1 hour ago, IIYAMA said:

local fonts = {}
local scalingPercentagePerSample = 0.05 -- 5%
local samplesCount = 10

-- samplesCount validate --
if samplesCount / 2 ~= math.floor(samplesCount/2) then
	samplesCount = samplesCount+1
end
---------------------------


function dxCreateSamplesForFont (filepath, size)
	local _, screenY = guiGetScreenSize() 
	local samples = {}
	for sampleScaleMultiplier=1, samplesCount do 
		sampleScaleMultiplier = sampleScaleMultiplier - samplesCount/2
		local newSize = size * (screenY/1024) - (size * (screenY/1024) * (sampleScaleMultiplier * scalingPercentagePerSample))
		iprint("newSize:", newSize)
		local font = dxCreateFont(filepath, newSize)
		samples[#samples+1] = {newSize, font}
	end
	return samples
end


fonts[":race/addons/font.ttf"] = dxCreateSamplesForFont (":race/addons/font.ttf", 10)

And if you create samples?

 

I suppose that'll give me a table of created fonts with different sizes, but wouldn't it give me the same results if I did something like this?
 

local _, screenY = guiGetScreenSize()
samples = {
		dxCreateFont("addons/font.ttf",8*(screenY/1024)),
		dxCreateFont("addons/font.ttf",10*(screenY/1024)),
		dxCreateFont("addons/font.ttf",14*(screenY/1024)),
		dxCreateFont("addons/font.ttf",16*(screenY/1024)), 
		dxCreateFont("addons/font.ttf",18*(screenY/1024)),
		dxCreateFont("addons/font.ttf",20*(screenY/1024)),
		dxCreateFont("addons/font.ttf",22*(screenY/1024)),
		dxCreateFont("addons/font.ttf",60*(screenY/1024)),
	}

 

[IIYAMA]

Yea it would, just not automatic and not easy to maintain.

 

samples = {
		{8*(screenY/1024)), dxCreateFont("addons/font.ttf",8*(screenY/1024))},
		{10*(screenY/1024), dxCreateFont("addons/font.ttf",10*(screenY/1024))}
	-- ...

}

function getFontFromSize (size)
	local sampleIndex = 1
	for i=1, #samples do
		if size > samples[i][1] then
			sampleIndex = i
		else
			return samples[sampleIndex][2]
		end
	end
	return samples[sampleIndex][2]
end

local font = getFontFromSize (10 *(screenY/1024))

function getFontVariantFromSize (font, size)
	local sampleIndex = 1
	local samples = fonts[font]
	for i=1, #samples do
		if size > samples[i][1] then
			sampleIndex = i
		else
			return samples[sampleIndex][2]
		end
	end
	return samples[sampleIndex][2]
end

local font = getFontVariantFromSize (":race/addons/font.ttf", 10 *(screenY/1024))

Untested of course...