LövelyToasts: Toast messages!

[togFox]

So, bumping this thread because I think it needs bumping.

This library is neat and I've used it a lot. I suddenly came up with an incompatibility with another module and since I've nutted it out, I thought i would post here.

When lovelytoast draws a toast message, it correctly takes

Code: Select all

love.graphics.getWidth() 

and divides by two to get the centre of the screen (x-axis). This is as expected and works fine.

I then used this library with a auto-screen resizer thingy that scales all drawing events to new monitor/desktop sizes. The one I use is tlfres.lua. It's an oldie but goodie. tlfres was printing the toast message left-of-centre and I couldn't work out why but I got it eventually.

If I 'code' for a window that is 1920 wide but is actually displayed on a screen that is 1440 wide then tlfres will automatically scale everything by 0.75 (1440/1920 = 0.75) in a way that is transparent to the coder (me) so I don't even need to think about this. An unexpected consequence:

- I code my game assuming 1920
- I invoke lovelytoast
- lovelytoast 'grabs' the real monitor size (1440)
- lovelytoasts draws in the centre of the screen (x = 720)
- tlsfres then scales that by 0.75
- the toast message now appears x = 540 which is left of centre



To be clear, this isn't the fault of lovelytoasts. Just an unexpected incompatibility.

My solution:

I don't let lovelytoasts grab the real screensize. Instead I feed in (via parameter) the screensize it needs to pretend and work with. In my case, I tell LT to pretend the screen width is 1920:

- I code my game to screen width 1920
- invoke LT and tell it to pretend screen width is 1920
- LT draws centre of 1920 (960)
- tlsfres then scales that by 0.75 (720)

The toast message is now correctly centred (noting I'm ignoring the width of the text and font for simplicity).

I modified the LT library to accept another optional parameter - the assumed width of the screen:

lovelyToasts.show("This is a toast message", 3, nil, 1920)

1920 is the assumed width of the screen. Sorry for all the text. It took me ages to work it out so thought this might help others.



Modified library attached.

[Lucyy]

So, bumping this thread because I think it needs bumping.

This library is neat and I've used it a lot. I suddenly came up with an incompatibility with another module and since I've nutted it out, I thought i would post here.

When lovelytoast draws a toast message, it correctly takes

Code: Select all

love.graphics.getWidth() 

and divides by two to get the centre of the screen (x-axis). This is as expected and works fine.

I then used this library with a auto-screen resizer thingy that scales all drawing events to new monitor/desktop sizes. The one I use is tlfres.lua. It's an oldie but goodie. tlfres was printing the toast message left-of-centre and I couldn't work out why but I got it eventually.

If I 'code' for a window that is 1920 wide but is actually displayed on a screen that is 1440 wide then tlfres will automatically scale everything by 0.75 (1440/1920 = 0.75) in a way that is transparent to the coder (me) so I don't even need to think about this. An unexpected consequence:

- I code my game assuming 1920
- I invoke lovelytoast
- lovelytoast 'grabs' the real monitor size (1440)
- lovelytoasts draws in the centre of the screen (x = 720)
- tlsfres then scales that by 0.75
- the toast message now appears x = 540 which is left of centre



To be clear, this isn't the fault of lovelytoasts. Just an unexpected incompatibility.

My solution:

I don't let lovelytoasts grab the real screensize. Instead I feed in (via parameter) the screensize it needs to pretend and work with. In my case, I tell LT to pretend the screen width is 1920:

- I code my game to screen width 1920
- invoke LT and tell it to pretend screen width is 1920
- LT draws centre of 1920 (960)
- tlsfres then scales that by 0.75 (720)

The toast message is now correctly centred (noting I'm ignoring the width of the text and font for simplicity).

I modified the LT library to accept another optional parameter - the assumed width of the screen:

lovelyToasts.show("This is a toast message", 3, nil, 1920)

1920 is the assumed width of the screen. Sorry for all the text. It took me ages to work it out so thought this might help others.



Modified library attached.

Hi! I'm super happy to hear you're enjoying LövelyToasts thanks for pointing out this small issue, I've managed to easily reproduce it

For now a simple work-around would be to call LT's draw function *after* tlfres's end rendering call like so:

Code: Select all

function love.draw()
	tlfres.beginRendering(CANVAS_WIDTH, CANVAS_HEIGHT)
	-- Do your rendering here
	tlfres.endRendering()
	
	LovelyToasts.draw()
end

This is obviously not a proper solution but it works as a workaround I've attached a love file to show this solution

LovelyToasts+TLFres Workaround.love.zip

(4.41 KiB) Downloaded 254 times

Alternatively I've updated LövelyToasts to work with custom canvas size Simply let LT know how big of a canvas to expect and it'll use that size instead of love.graphics's getWidth/getHeight functions:

Code: Select all

local CANVAS_WIDTH = 1920
local CANVAS_HEIGHT = 1080

function love.load()
	--

	LovelyToasts.canvasSize = { CANVAS_WIDTH, CANVAS_HEIGHT }
end

function love.draw()
	tlfres.beginRendering(CANVAS_WIDTH, CANVAS_HEIGHT)
	love.graphics.setBackgroundColor(1, 1, 1)
	LovelyToasts.draw()
	tlfres.endRendering()
end

[togFox]

oh great! A 'real' solution!

Fantastic.

[togFox]

One year and one 1 week later, I'm still using LovelyToasts.

For others using this library, default behaviour is to display a toast at the top, middle or bottom of the screen. I've forked the github and added a way to display a lovelyloast at any provided x/y value.

This lets me display toasts anywhere on the screen as a popup that can be clicked. I'll use this during the tutorial phase of the first mission in my game. Thanks to OP.

For others, if OP doesn't accept my pull request then see my fork.

[alejandroalzate]

there is a way to customize the toast? (besides to the position and time) if not i wouldn't mind to implement one and share it

[togFox]

there is a way to customize the toast?

In what way?

[alejandroalzate]

there is a way to customize the toast?

In what way?

Like Background, transparency, color, font you know what i mean?

[togFox]

You can use the github that OP posted or you can use my fork which already lets you adjust the position with x/y values instead of default top/bottom/centre.

This is my fork, not the original code: https://codeberg.org/togfox/Lovely-Toasts