animations object

[giorg]

Hi,

I'm correctly displaying a multiatlas animation this way:

this.anims.create({ key: 'open_1', frames: this.anims.generateFrameNames('open1'), repeat: 0 });
let op1 = ethis.add.sprite(490, 400).setScale(0.6).play('open_1');

then I need the animation to disappear once it's ended, so I'm doing:

op1.on('animationcomplete', ethis.openComplete, this);

but in the openComplete function I don't know how to access the op1 object to destroy it.

Any help?

Thanks a lot

[cornstipated]

this.anims.create({ key: 'open_1', frames: this.anims.generateFrameNames('open1'), repeat: 0 });
this.op1 = this.add.sprite(490, 400).setScale(0.6).play('open_1');

op1.on('animationcomplete', ethis.openComplete, this);

op1 no longer block scoped and available as this.op1 in callback since you are passing the this context. Good enough?

[jake.caron]

Hi! Instead of this:
 

op1.on('animationcomplete', ethis.openComplete, this);

use this:

op1.on('animationcomplete', ()=>{ethis.openComplete();});

That will ensure that you are still within your classes' scope.

[jamespierce]

Either pass it as an argument to the openComplete method:

op1.on('animationcomplete', ()=>{ this.openComplete(op1); }, this);

this.openComplete = function(op1) {
    // op1 is available
    op1.destroy();
};

Or add the op1 variable as a property to the scene / class / object (whatever your scope is) as @cornstipated suggested:

this.op1 = this.add.sprite(490, 400).setScale(0.6).play('open_1');
this.op1.on('animationcomplete', this.openComplete, this);

// Scene context
SceneName.openComplete = function() {
    // this.op1 is available
    this.op1.destroy();
};

// Object prototyping
ObjectName.prototype.openComplete = function() {
    // this.op1 is available
    this.op1.destroy();
};

 

[giorg]

thanks all!