Destroy function in phaser 3 doesn't destroy

Question

I'm new with phaser3, and I have a problem with destroying an object, specifically a spritesheet. However, when I call the destroy function on the object, the sprite disappears, but if debug is true I see the border, so I think it destroy only the sprite but not the object itself. Here is the code:

        const config = {
        type: Phaser.AUTO,
        width: 960,
        height:768,

        physics: {
            default: 'arcade',
            arcade: {
               
                debug: true
            }
        },

        scene: {
            preload: preload,
            create: create, 
            update: upload
        }
    };

    let platforms;
    let player;
    let cursors;
    let wall;
    let container;
    let weapon;
    let fire;
    let explosion;

    const game = new Phaser.Game(config);

    function preload() {
        this.load.image('ground', 'sfondo.png');
        this.load.image('wall', 'Track_1_A.png');

        this.load.spritesheet('explosion', 'boom2.png', {
            frameWidth: 248,
            frameHeight: 253
        })
    
        this.load.spritesheet('tank', 's.png', {
            frameWidth: 187,
            frameHeight: 393
        }, 0);
    };

    function create() {
        this.add.image(480, 384, 'ground');
        
        platforms = this.physics.add.staticGroup();

        //platforms.create(100, 150, 'wall').setScale(0.60).refreshBody();
        //platforms.create(100, 400, 'wall').setScale(0.60).refreshBody();
        //platforms.create(400, 150, 'wall').setScale(0.60).refreshBody();
        //platforms.create(400, 400, 'wall').setScale(0.60).refreshBody();
        //platforms.create(700, 150, 'wall').setScale(0.60).refreshBody();
        //platforms.create(700, 400, 'wall').setScale(0.60).refreshBody();


        cursors = this.input.keyboard.createCursorKeys();
        player = this.physics.add.sprite(480, 384,'tank');
        player.setScale(0.30)
        player.setCollideWorldBounds(true);
        this.physics.add.collider(player, platforms);

        this.anims.create({
            key: 'fire', 
            frames: this.anims.generateFrameNumbers('tank', {start: 0, end: 15}),
            frameRate: 20
        });    
        
        explosion = this.physics.add.sprite('explosion');

        this.anims.create({
            key: 'boom',
            frames : this.anims.generateFrameNumbers('explosion', {start: 0, end: 9}),
            frameRate: 20
        });

    };

    function upload() {
        
        

        
        if (cursors.left.isDown)
        {
            player.angle = -90;
            player.setVelocityX(-300);  
            player.setSize(393, 187)  
              
        }
        else if (cursors.right.isDown)
        {
            player.angle = 90
            player.setVelocityX(300);
            player.setSize(393, 187)
        }
        else
        {

            player.setVelocityX(0);
              
        }

        if (cursors.up.isDown)
        {
            player.angle = 0;
            player.setVelocityY(-300);
            player.setSize(187, 393)
        }
        else if (cursors.down.isDown) 
        {
            player.angle = 180
            player.setVelocityY(300);
            player.setSize(187, 393)
        }
        else {
            player.setVelocityY(0);
        
        }

        //camminata obliqua 
        if (cursors.up.isDown && cursors.left.isDown) {
            player.angle = -45;
            
        }
        if (cursors.up.isDown && cursors.right.isDown) {
            player.angle = 45;
            
        }
        if (cursors.down.isDown && cursors.left.isDown) {
            player.angle = -135;
            
        }
        if (cursors.down.isDown && cursors.right.isDown) {
            player.angle = 135;
            
        }

        if(cursors.space.isDown) {
            player.setTexture('explosion');
            player.anims.play('boom');
            
            if (player !== undefined) {
                player.destroy();
            }
        }
    };

Anyone can help for destroy totally the object? Thanks to everyone!

user_1679286 · Answer

As mentioned by @Tom, in the comment-section, you would have to move the two lines player... into the inner if-clause, since as soon as the player is destroyed the first time, in the next update loop call, the call of player.setTexture(...), will cause a error.

In addition, you will also have to make some other minor tweaks, to get it running smoothly:

update your code to this:

    ...
    function upload() {
        // just to prevent updates on the player or physics body
        // after the destroy() method was call
        if(!player || !player.body){
           return;
        }
        ...
        if(cursors.space.isDown) {
            // just to be sure that the player is destoryed only once
            if(player && (!player.anims.isPlaying || player.anims.currentAnim.key !== 'boom' )) {
                player.setTexture('explosion');
                player.play('boom');

                // Call the destroy method, after the animation has run                 
                player.on(Phaser.Animations.Events.ANIMATION_COMPLETE_KEY + 'boom', _ => {
                    player.destroy();
                });
            }
        }
        ...
   }
   ...

Destroy function in phaser 3 doesn't destroy

1 Answers