Resolution does not work

[Legomite]

Version

• Phaser Version: 3.16.1, 3.16.2, 3.17.0

• Operating system: macOS

• Browser: Safari, Chrome, Firefox

Description

High resolution does not appear to work on 3.16.1 and 3.16.2. It works correctly on 3.15. This is tested with the Phaser Labs resolution example, where two pieces of text are compared with different resolutions.

Example Test Code

https://labs.phaser.io/view.html?src=src/game%20config\scale\resolution.js

Additional Information

I am not sure if this is intentional behavior, but anti aliasing appears to be applied on the low resolution text in 3.16. This behavior doesn't occur in 3.15. The low resolution text's low res pixels are shown crisp. This could attribute to the fact that resolution doesn't work in general though, because the canvas itself is running in resolution of 2, which would make the low resolution text's pixels sharp.

[nani92]

Same here :(
Any update?

[dotgreg]

from the documentation, they indeed said they got a problem with the new scale manager and thus hardcoded the resolution to 1
https://photonstorm.github.io/phaser3-docs/Phaser.Scale.ScaleManager.html

"This is hard-coded to a value of 1 in the 3.16 release of Phaser and will be enabled at a later date."

Did someone find a solution? as the result is canvas is appearing blurry on phones...

[dotgreg]

So, as I had to make it working, here are some possible solutions, neither are perfect.

1. downgrade to 3.15, the resolution works fine there
2. (I chose that one) scale all the elements (x,y,size etc...) manually to that resolution by multiplying it (so 12px becomes 12*resolution px), takes time, it is sort of a manual yet painful way of solving it, but at least I am controlling it now, so was worth it in my case

Hope it helps

[FantaZZ]

mark, wait for resolution.
Has any plan?

[ghempton]

Still experiencing this on 3.18 (and 3.19 beta).

[photonstorm]

Of course, because it hasn't been done yet. Otherwise, this issue would be marked as resolved.

[stephanvermeire]

Hi Richard,

Thanks for your great work om Phaser so far. :-)

Yesterday you announced plans of the new Phaser 4 version and you stated that the development expected to start in august. That is great news!

What is your time scedule regarding to implementing the scale feature in Phaser 3.x? Is it still expected to be released? If so, could you give us a time indication of your time scedule?

Thanks,
Stephan

[Martin-Antonov]

After battling with this issue for a while now I have come up with a very manual fix for the issue. Hope someone can find this helpful. The 'only' problem I had with using the "resolution" property is that the user input with the mouse/touch was calculated incorrectly. With the approach below, it was ok

// Game Config    
const dpr = window.devicePixelRatio;
    const width = window.innerWidth * dpr;
    const height = window.innerHeight * dpr;

    const config: GameConfig = {
      type: Phaser.CANVAS,
      backgroundColor: '#000',
      scale: {
        parent: 'the-canvas',
        mode: Phaser.Scale.NONE,
        width: width,
        height: height,
      },

// We use window resize, otherwise we get recursion in the resize method
 window.addEventListener('resize', () => { this.resize();  });
private resize() {
    const dpr = window.devicePixelRatio;
    const widthDPR = Math.round(window.innerWidth * dpr);
    const heightDPR = Math.round(window.innerHeight * dpr);

    this.scene.scale.parent.width = Math.round(window.innerWidth);
    this.scene.scale.parent.height = Math.round(window.innerHeight);

    this.scene.scale.canvas.width = widthDPR;
    this.scene.scale.canvas.height = heightDPR;

    this.scene.scale.canvas.style.width = Math.round(window.innerWidth) + 'px';
    this.scene.scale.canvas.style.height = Math.round(window.innerHeight) + 'px';

    this.scene.scale.setGameSize(widthDPR, heightDPR);
    this.scene.scale.setParentSize(window.innerWidth, window.innerHeight);
    // Resize stuff, if needed

[zaniar]

@photonstorm any update on this? Are there any difficulties implementing it?

[brokolja]

FYI: Bug still existing in 3.22.0

[androidovshchik]

FYI: Bug still existing in 3.22.0

3.23.0 +

[photonstorm]

This is a feature request, not a bug, and no work has been done on implementing it yet. I would consider a non-invasive PR, however.

[alexandernst]

But that's actually a regression, IMHO. This was working in the early days of 3.x IIRC.

[zaniar]

@photonstorm
Any pointer from you on what do you think the best way to implement it? Or maybe things to take note?

I would like to try to implement it since I need this feature.

[jamesplease]

This is a feature request, not a bug, and no work has been done on implementing it yet. I would consider a non-invasive PR, however.

Yo @photonstorm ! Thanks for creating this library and sharing it with the community. It's been super cool to learn and use.

I'd love for this feature to be added, but I understand there are other things that are higher priority. Maybe I'll have time to dig into the code and try to implement it myself.

In the meantime, would you be open to a PR that:

1. Removes the resolution option from the types of Game
2. Deletes the archived example showing how to use this option, or that otherwise makes it more clear that those examples do not show real APIs
3. Include somewhere in the docs that Phaser v3 does not provide any tooling out-of-the-box to support high resolution displays, and that it is up to the user to manage it (perhaps in the opening section of the docs for Game?)

I know I've got time to make these changes if you'd be willing to merge them.

imo until these changes are made it's tough for me to follow the argument that this is a feature request, as any new user to the library will reasonably assume that this feature is supported, and likely be pretty confused when it isn't working. As a new user, I can attest to this!

I think the perspective of it being a bug might be more relatable if you imagine that this were some other feature, like, say, Sprites. Consider if one day a new version were released that got rid of Sprites. But the typings for Sprites were still distributed, and the examples for sprites were moved under "archive". If someone opened an issue saying, "hey sprites were working on v3.20 but are broken in 3.21!" I would totally get where they were coming from.

No worries either way, though. Just thought I'd share my two cents.

In any event, I really want to stress how appreciative I am of all of the work you've put into this library! It really shows.

Cheers ✌️

[photonstorm]

I will go through and remove all mentions of resolution for the 3.50 release to avoid any confusion, as I agree, it must be confusing for those reading the docs.

The reason this isn't a 'bug', or even a regression, is that it has never been a feature that the Scale Manager has ever had. It's simply never had this feature. The properties currently in the game config were leftover from an earlier non-SM time (and, frankly, I'm not sure it ever worked properly with input + containers then, either!).

If HighDPI support is a project requirement, all I can suggest is using another framework instead of v3. I've made sure that it's supported fully from the start in v4, but retroactively fitting it now to v3 will break more than it fixes.

[jamesplease]

I appreciate the thorough write-up, @photonstorm !

I will go through and remove all mentions of resolution for the 3.50 release to avoid any confusion, as I agree, it must be confusing for those reading the docs.

Thank you 🙏

The reason this isn't a 'bug', or even a regression, is that it has never been a feature that the Scale Manager has ever had. It's simply never had this feature. The properties currently in the game config were leftover from an earlier non-SM time (and, frankly, I'm not sure it ever worked properly with input + containers then, either!).

Ah, okay, that makes sense! I didn't know that.

If HighDPI support is a project requirement, all I can suggest is using another framework instead of v3. I've made sure that it's supported fully from the start in v4, but retroactively fitting it now to v3 will break more than it fixes.

This approach makes sense to me. I'm excited for v4...it sounds like it's going to be awesome!

Thanks again for creating, maintaining, and improving this awesome library, @photonstorm 😁

[brokolja]

By the was i use zoom: 0.5 and double-sized graphics. Looks pretty sharp on retina...

[hujinliang]

So, as I had to make it working, here are some possible solutions, neither are perfect.

1. downgrade to 3.15, the resolution works fine there
2. (I chose that one) scale all the elements (x,y,size etc...) manually to that resolution by multiplying it (so 12px becomes 12*resolution px), takes time, it is sort of a manual yet painful way of solving it, but at least I am controlling it now, so was worth it in my case

Hope it helps

hi, I also use the second solution, is there any issue?