Tween, how does one reuse one? Should I?

Phaser 3
1

Sorry for a real newbie question. I wish there was a tutorial / article / guide on tweens like there is on Scenes here.. :frowning:

I have the following situation: There is a textfield that I need to fade in and fade out, when I rollver different Zones in the scene:
image

I’ve created the tween with this code:
this.textFadeTween = this.tweens.add({
targets:this.menu_txt,
alpha:1,
ease:“Power3”,
duration:1500,
paused:true
});

and then inside of this function (which is the mouse input handler for Zones) I want to fade in the tex(on GAMEOBJECT_OVER) and fade out the text (on GAMEOBJECT_OUT) :
private toggleParticles(pointer : Pointer, zone : Zone, mouseEventPhase:string) : void
{
let rect : Rectangle = new Phaser.Geom.Rectangle(zone.x, zone.y, zone.width, zone.height);

    if (mouseEventPhase == GAMEOBJECT_OVER)
    {
        this.emitter.setEmitZone({source: rect});
        this.emitter.start();
        this.menu_txt.setText(zone.name);
        this.textFadeTween.restart();
    }
    else if (mouseEventPhase == GAMEOBJECT_OUT)
    {
        this.emitter.stop();
        this.menu_txt.setAlpha(0);
    }
}

I can’t find the way how to use the same tween (this.textFadeTween) to instruct itto go from alpha 1 to alpha 0…

Is this possible in Phaser? Or do I have to create a 2 separate tweens one from fadeing in and one for fadeing out?

2

Hi! I’m actually just starting to explore Phaser3 as well, but a quick google turned up this:

and while it doesn’t specifically apply, I believe it has some good advice about not wanting to prematurely optimize.

I’d say make two tweens. I like to side on readability and having two clearly defined tweens called ‘textFadeInTween’ and ‘textFadeOutTween’ might be more readable

1 Like
3

Thank you Tony,
I actually ended up using 2 tweens at the end, one for fading out and one for fading in the textfield…
and coincidently I did call them :
private textFadeInTween : Phaser.Tweens.Tween;
private textFadeOutTween : Phaser.Tweens.Tween;
:slight_smile:

1 Like