melonjs / melonJS

a fresh, modern & lightweight HTML5 game engine
https://melonjs.org
MIT License
5.92k stars 643 forks source link

Sprite.scale appears to screw up mousedown events and also SVGs are pixelated upon scaling #1079

Closed customautosys closed 1 year ago

customautosys commented 2 years ago

Dear Olivier,

I've just started on a simple new game and I realise that when I scale a sprite, it somehow screws up the mousedown events on that sprite (clicks aren't detected). I've tried calling resize both before and after the scale. If I call resize before the scale then the scale does nothing and the clicks are not screwed up. However, if I call resize after the scale, the scale works but the clicks are still screwed up.

Also, I noticed that when I try to draw SVGs, the SVGs are pixelated (which I didn't expect to be the case as SVGs are supposed to scale well).

Any idea how to fix these issues?

obiot commented 2 years ago

or with the changes in your pull request, the first issue is fixed ?

about SVG I actually never used them, but I think the issue is that melonJS is scaling the whole canvas, and might not reset the SVG scaling "capabilities" if I can say

customautosys commented 2 years ago

or with the changes in your pull request, the first issue is fixed ?

about SVG I actually never used them, but I think the issue is that melonJS is scaling the whole canvas, and might not reset the SVG scaling "capabilities" if I can say

I have kind of solved the SVG scaling problem by not using the preloader / identifying the source image by string, and creating an Image() instead. I then vary the width and height of the Image() and do an await to ensure that it is loaded before passing it to the Sprite constructor.

The other PR didn't fix the mousedown issue; it only stopped the game from crashing every time a Sprite which has mouse events is removed from the world. It seems like maybe the bounding box of the Sprite is not updated after scale(). I will see what I can do after some hackery.

obiot commented 2 years ago

for the scaling, it does actually update the bounding box, have you tried using the debug panel and display the bounding box (green ones) ? you should then see what happen when you are scaling your sprite.

Sprite, extends Renderable, that extends Rect that extends Polygon, and in the Rect class every time the width or height is modified the bounding box is updated (see for example here : https://github.com/melonjs/melonJS/blob/master/src/geometries/rectangle.js#L136)

so this should work ....

customautosys commented 2 years ago

for the scaling, it does actually update the bounding box, have you tried using the debug panel and display the bounding box (green ones) ? you should then see what happen when you are scaling your sprite.

Sprite, extends Renderable, that extends Rect that extends Polygon, and in the Rect class every time the width or height is modified the bounding box is updated (see for example here : https://github.com/melonjs/melonJS/blob/master/src/geometries/rectangle.js#L136)

so this should work ....

Hi would like to give you my code for access like the last time, private and confidential basis (no further distribution) for you to improve melonjs.

I email you the zip file like the last time?

obiot commented 2 years ago

sure ! thanks :)

obiot commented 1 year ago

closing this one, @see #1170