phaserjs / phaser

Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.
https://phaser.io
MIT License
37.15k stars 7.1k forks source link

setScale and MatterJS body anchor point are inconsistent when scaling 1x1px Image #3983

Closed rydash closed 4 years ago

rydash commented 6 years ago

I think this is different than #3785, but my apologies if they are linked!

Version

Description

Phaser scales a 1x1 image such that the source image's center ends up where the top-right of the scaled image is expected, and the bottom right corner ends up where the center of the scaled image is expected.

Complicating things, a MatterJS body attached to the pre-scaled 1x1 image will align its body in the "expected" position after the scale, but the image itself becomes misaligned with the body.

Example Test Code

It'll be easiest to see the mismatch here: https://codepen.io/anon/pen/PdNNRa

Additional Information

I'm afraid I don't have a fix in mind, as I'm not familiar with Phaser's image code! I found the issue simply because I'm lazy and wanted to make a bunch of rectangles with the same 1x1 source image and apply tints, but discovered they required alignment adjustments. Adding MatterJS on top of that made the problem more obvious.

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/62638762-setscale-and-matterjs-body-anchor-point-are-inconsistent-when-scaling-1x1px-image?utm_campaign=plugin&utm_content=tracker%2F283654&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F283654&utm_medium=issues&utm_source=github).
photonstorm commented 4 years ago

Sorry for not closing this sooner, but this was fixed in v3.22.