Phaser.WEBGL blurry on iPhone

Phaser 3
1

Hey all,

I’ve made a lo fi pixel art puzzle game for #LOWREZJAM. The max allowed resolution for the jam is 64x64 pixels. You can play here https://fazz.itch.io/pulse

I’ve tested it on Windows (Chrome + FF) and Android (Chrome + FF) and all works fine. But on iPhone the pixel art is all blurry. Also, the sounds doesn’t work though that’s likely because I’m only including m4a and ogg files. I presume I need to add mp3s for iPhone support. Anyway, the blurring…

My game conf looks like this,

game = new Phaser.Game({
    type: Phaser.WEBGL,
    scale: {
        mode: Phaser.Scale.FIT)
        autoCenter: Phaser.Scale.CENTER_BOTH,
        parent: 'screen',
        fullscreenTarget: 'screen',
        width: 64,
        height: 64,
        zoom: 8
    },
    pixelArt: true,
    antialias: false,
    backgroundColor: 0x000000,
    autoFocus: true,
    disableContextMenu: true,   // disable right mouse button context menu
    fps: 60,
    scene: [
        ..
    ],
});

I’ve tweaked the settings quite a bit but the only way I can get it to look crisp on iPhone is to switch to Phaser.CANVAS, but the game relies on tint so this is a no go.

Has anyone experienced any similar issues rendering pixel art on iPhone?

Thanks!

2

UPDATE: looks like it’s the same issue as High resolution is not as sharp as possible?

Bug already raised: https://github.com/photonstorm/phaser/issues/4417