Phaser 3 game not scrolled when page scrolls

Phaser 3
1

I am developing a game using Phaser 3.18 and the game is part of an angular app(using angular 8). There are buttons in the game created by using the setInteractive() function. The game and buttons work fine. But when the page is scrolled the buttons do not work properly i.e. the hitArea of buttons is not updated. The whole game scrolls with the page but the coordinates of buttons don’t update.

Code of button created:

var sprite = this.add.sprite(screen_width*0.5, screen_height*0.5, 'eye').setInteractive();
sprite.setScale(1.5);
sprite.on('pointerdown', function(event){
  console.log('here click working');
});

Config function of Phaser game:

function config(render_type){
    this.type=render_type;
    this.scale = {
        width: 800,
        height: 400,
        mode: phaser.Scale.FIT,
        parent: "phaser-example",
        autoCenter: phaser.Scale.CENTER_BOTH,
    };
    this.physics= {
        default: 'arcade',
        arcade: {
            gravity: { y: 3000 },
            debug: false

            }
        };

    this.scene={
        preload: preload,
        create: create,
        update: update
    };
};
1 Like
2

Hello my friend!
It is late answer but i just registered. I have the same issue and to fix it i add:

this.scale.refresh();

In the update method of the scene.