[Solved] How do you use TLfres?

[Sabun]

Hi there,

TLfres
So I'm trying to learn the ropes on changing between resolutions and fullscreen/windowed-mode. I've been trying to use TLfres as according to this: https://love2d.org/wiki/TLfres

The first problem I encounted with version 1.0.4 is the following error:

Code: Select all

TLfres.lua:36: attempt to perform arithmetic on global 'e' (a nil value)

On inspection of the TLfres.lua file, I changed all the 'e's in letterbox to:

Code: Select all

function TLfres.letterbox(w,h, c)
	w,h,c = w or 4, h or 3, c or {0,0,0, 255}
	color(c)
	
	local tall,de = TLfres.e/w*h, TLfres.e*2
	if TLfres.centered then
		rect("fill", -TLfres.e,-TLfres.e, de,TLfres.e-tall)
		rect("fill", -TLfres.e,TLfres.e,  de,tall-TLfres.e)
	else
		local o = (ws-hs) / ws * (TLfres.e-1)
		rect("fill", 0,-o,   de,TLfres.e-tall)
		rect("fill", 0,de-o, de,tall-TLfres.e)
	end
end

This fixed the error, but I'm not sure if I should have done that or not.

Anyhow, I followed the wiki and applied TLfres into my code to test it. Before even changing resolution, my game already looks messed up! I attached an image to show what I mean. The game's original resolution is at 1280x768.

I make sure to call TLfres.setScreen in love.load(), but is this the correct place to call it?

Code: Select all

TLfres.setScreen({w=1280,h=768,full=false,vsync=false,aa=0},1280)

My love.draw looks like this:

Code: Select all

function love.draw()
	
	TLfres.transform()

	--draw backgrounds first, then other stuff
	background_draw()

	if gamestate == "menu" then
		button_draw()
	elseif gamestate == "optionmenu" then
		optionbutton_draw()
	end

	--draw the frames per second
	love.graphics.print("Current FPS: "..tostring(love.timer.getFPS()), 10, 30)
	TLfres.letterbox(12,9)
end

What could I be doing wrong with TLfres? I've attached TLfres.love so that you may inspect it if needed.

love.graphics.setMove()
I also tried using love.graphics.setMode() instead of the TLfres file. With the setMode(), my game looks fine in windowed-mode. However, when going fullscreen to a resolution of 1920x1080 (my native resolution), a black bar appears on the right and my button's mousepress checks are off to the left of the actual button images. I try to follow what felix24 says here: viewtopic.php?t=8991&p=55448

As such in options.lua I try the following to change from windowed-mode to fullscreen:

Code: Select all

function go_fullscreen()
	--sets the game into fullscreen
	--love.graphics.toggleFullscreen()
	love.graphics.setMode( 1920, 1080, true, false, 0)
	scaleAmount = love.graphics.getHeight()/768
	currentHeight = love.graphics.getHeight()	

	if scaleAmount > 1 then			--scale up
    		int,fract = math.modf(scaleAmount)
    		movey = currentHeight * fract
	elseif scaleAmount < 1 then		--scale down
    		movey = currentHeight * (1-scaleAmount)
	end
end

function go_windowed()
	--sets the game into windowed mode
	--love.graphics.toggleFullscreen()
	love.graphics.setMode( 1280, 768, false, false, 0)
	scaleAmount = love.graphics.getHeight()/768
	currentHeight = love.graphics.getHeight()	

	if scaleAmount > 1 then			--scale up
    		int,fract = math.modf(scaleAmount)
    		movey = currentHeight * fract
	elseif scaleAmount < 1 then		--scale down
    		movey = currentHeight * (1-scaleAmount)
	end
end

Returning to windowed-mode works fine, but going into fullscreen with the resolution changing to 1920x1080 is a problem. I've attached setMode.love so that you may inspect it if needed.

Any help or guidance on the matter is greatly appreciated by me

[Taehl]

Hi there. Sorry about the e thing, must have I messed that up when renaming variables. I've fixed it, so if you like you can re-download it here.

I checked your .love file. The reason the buttons are in odd places is because you move them according to the screen's resolution. Then, when TLfres resizes everything, the buttons are moved further. You should just leave them where they're supposed to be in native res. There's a couple different ways to handle clicking the buttons when the window is a different size... You could scale the mouse's coordinates by the size of the screen, which is what I did. When changing resolutions, you forgot to change your variables screen_width and screen_height, which led to some issues. You also gave the wrong aspect ratio to TLfres.letterbox (1280x768 is 5:3, not 12:9). And since you use full stretching instead of aspect-correct stretching, you don't even need to use letterboxing.

I've attached the fixed .love. I've commented on each thing I changed (search for "corrected"), in main.lua, menu.lua, and options.lua. Hope that helps.

[Sabun]

Thank you Taehl for taking the time to reply and help me!

I just wish to confirm some things. First, is it the correct way to always place objects using absolute values based on the preset resolution of the game? (e.g 1280x768 here)

Secondly, even after scaling the mouse's coordinates by the screen size, once it goes into 1920x1080 fullscreen it is still slightly off (it highlights the buttons, despite the mouse cursor being above the button). What are some of the other ways to handling clicking buttons when the window size changes?

Thank you for guiding me on this, it's very much appreciated

[Taehl]

No problem, I'm glad I could help.

Yes, the correct way (in TLfres) is to leave all your coordinates at wherever they should be for native res. I tried to make it require as little work as possible, and figured that never having to move stuff would be the least work of all. Plus, I intended TLfres to be a "drop-in solution", so adding it to an existing project would require no re-writing stuff.

Sorry I couldn't test that fullscreen, my monitor only goes up to 1024x768. But it seems that the problem is from using stretching in the logic (where the mouse is), but not stretching the graphics. There's... Some kind of math you could do to get the right coordinates in an aspect-ratio-maintaining scaling situation, but I'll be damned if I know what it is (sorry, math isn't my strong suit). If you can't figure it out, then I'd advise either using stretching instead of aspect-ratio-scaling (the last parameter in TLfres.setScreen), or making your menu use keyboard or joystick instead of the mouse.

[Sabun]

Alright, thank you very much Taehl

At least now I have a leg to stand on, and can try different resolution changes.

Thanks once again for guiding me, and for sharing the TLfres.lua

[SiENcE]

I wrote and article in my blog about pixelperfect scaling.

http://crankgaming.blogspot.de/2013/01/ ... aling.html

I also looked into TLfres, but it doesn't fit my needs so i implemented it in a new way.

I can share it, if someone is interested in.