Phaser 3 Extended update sprite bug

by Halil ÇAKAR

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/3.16.2/phaser.js"></script>

Babel + JSX

class MyScene extends Phaser.Scene {

    constructor (config)
    {
        super(config);
    }
    
    init() {
    	this.centerX = this.game.config.width / 2;
      this.centerY = this.game.config.height / 2;
    }

    preload (){}

    create ()
    {
    		/* Create dynamic sized text and background */
        const text = this.add.text(0, 0, 'AWESOME', { 
        	font: "32px Arial Black", fill: "#0000ff"
        }).setOrigin(0.5);
        const text_bounds = text.getBounds();
        const w_text = text_bounds.width + 20;
        const h_text = text_bounds.height + 20;
        
        const bg_graphic = this.add.graphics()
          .fillStyle(0xffff00, 1)
          .fillRoundedRect(0, 0, w_text, h_text, 30)
          .generateTexture('text_bg', w_text, h_text).destroy();
        // I prefer generate the texture from graphics if it's not gonna redraw again.
        let bg = this.add.image(0, 0, 'text_bg');
                
        this.word = this.add.container(this.centerX, this.centerY, [bg, text]).setSize(w_text, h_text)
        .setInteractive({ useHandCursor: true, draggable: true })
        
				this.input.on('drag', function (pointer, gameObject, dragX, dragY) {
          gameObject.x = dragX;
          //If also needed for Y drag open this:
          // gameObject.y = dragY;
        });

    }

}

var config = {
    type: Phaser.WEBGL,
    width: 800,
    height: 600,
    backgroundColor: '#000000',
    parent: 'phaser-example',
    scene: MyScene
};

var game = new Phaser.Game(config);