Page 1 of 1

Mobile scaling.throw off my image start button(HELP)

Posted: Wed Jan 29, 2020 12:51 pm
by Donut-Dezz
OK. the ? is when you scale like this . using an image button the scaling change the image button position on love.touchpressed and love.mousedpressed?. my question is how do you keep the image start button position. when scaling. scaling changes the start button position. and when i press on the start button image it does nothing?




when i press on the start button image on mobile. in love.touchpressed it does nothing. but when i dont use scaling it works. but when i use scaling it dont work.









state = "menu"

buttons = {}
button = {x = 100,y = 200,start=love.graphics.newImage("start.png")}

quit = {}
quittable = {x=498,y=228,text=love.graphics.newImage("quit.png")}

scalex = 795
scaley = 720



function love.load()

table.insert(buttons,button)
table.insert(quit,quittable)

end


function love.draw()

love.graphics.scale(love.graphics.getWidth() / scalex,love.graphics.getHeight()/ scaley)
if state == "menu" then
for i,v in ipairs(buttons) do
love.graphics.draw(v.start,v.x,v.y)
end

end
if state =="menu" then
for ii,vv in ipairs(quit) do
love.graphics.draw(vv.text,vv.x,vv.y)
end
end


if state =="play" then
love.graphics.print("GAME START",200,300)
end





end




function love.touchpressed(id,x,y)
mousex = (x - love.graphics.getWidth()) / scalex
mousey = (y - love.graphics.getHeight()) / scaley

for i,v in ipairs(buttons) do

if x + mousex > v.x and x + mousex < v.x + v.start:getWidth() and y + mousey > v.y and y + mousey < v.y then
state ="play"
end

for ii,vv in ipairs(quit) do
if x > vv.x and x < vv.x + vv.text:getWidth() and x > mousex and x < mousex and y > mousey and y < mousey and y > vv.y and y < vv.y + vv.text:getHeight() then
love.event.quit()
end
end

end

end


function love.mousepressed(x,y,button)

mousexx = (x - love.graphics.getWidth()) / scalex
mouseyy = (y - love.graphics.getHeight()) / scaley
for i,v in ipairs(buttons) do

if x > v.x and x < v.x + v.start:getWidth() and y > v.y and y < v.y and button == 1 then
state ="play"
end

for ii,vv in ipairs(quit) do
if x > vv.x and x < vv.x + vv.text:getWidth() and x > mousex and x < mousex and y > mousey and y < mousey and y > vv.y and y < vv.y + vv.text:getHeight() then
love.event.quit()
end
end

end

end

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Wed Jan 29, 2020 3:13 pm
by pgimeno
Can you please use [ code ] ... [ /code ] tags around your code? Hit the "Reply with quote" button on this message for an example of how to use them (but don't click submit).

This:

Code: Select all

mousex = (x - love.graphics.getWidth()) / scalex
mousey = (y - love.graphics.getHeight()) / scaley
should be:

Code: Select all

mousex = x / scalex
mousey = y / scaley
Similarly in love.mousepressed.

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Thu Jan 30, 2020 4:57 am
by Donut-Dezz
pgimeno wrote: Wed Jan 29, 2020 3:13 pm Can you please use [ code ] ... [ /code ] tags around your code? Hit the "Reply with quote" button on this message for an example of how to use them (but don't click submit).

This:

Code: Select all

mousex = (x - love.graphics.getWidth()) / scalex
mousey = (y - love.graphics.getHeight()) / scaley
should be:

Code: Select all

mousex = x / scalex
mousey = y / scaley
Similarly in love.mousepressed.
pgimeno wrote: Wed Jan 29, 2020 3:13 pm Can you please use [ code ] ... [ /code ] tags around your code? Hit the "Reply with quote" button on this message for an example of how to use them (but don't click submit).

This:

Code: Select all

mousex = (x - love.graphics.getWidth()) / scalex
mousey = (y - love.graphics.getHeight()) / scaley
should be:

Code: Select all

mousex = x / scalex
mousey = y / scaley
Similarly in love.mousepressed.

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Thu Jan 30, 2020 4:58 am
by Donut-Dezz

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Thu Jan 30, 2020 5:02 am
by Donut-Dezz
can you write it out in using mouse click example?

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Thu Jan 30, 2020 5:54 am
by Donut-Dezz
Can you do a tutorial here so other people can grasp this problem with scaling and love.mousepressed ?

Re: Mobile scaling.throw off my image start button(HELP)

Posted: Thu Jan 30, 2020 11:26 am
by pgimeno
Donut-Dezz wrote: Thu Jan 30, 2020 5:54 am Can you do a tutorial here so other people can grasp this problem with scaling and love.mousepressed ?
The topic is somewhat big. It's all about transforming from one coordinate system to another. The mouse position is returned by LÖVE in screen coordinates, that is coordinates from 0 to the screen width minus 1 horizontally, and to the screen height minus 1 vertically. When you scale, you're creating a new coordinate system, let's call it zoomed coordinates. You need to translate one to the other in order to make them comparable, then compare them in the chosen coordinate system.

I already explained coordinate transformations here:

https://love2d.org/forums/viewtopic.php ... 05#p230105