Make image/sprite fadeIn/fadeOut on loop?

Phaser 3
1

Hey guys,

I am trying to make a png of hand drawn text ‘press start’ blink or fadeIn/fadeOut on loop like in video game screens but I am struggling to figure out how to do it. I figure it is likely very simple. I am trying to use tweens, I’ve considered animating through various opacities of the the original png but I know there has to be a way to make it fade out, then fade back in continuously until ‘event’ occurs. While phaser is amazing every time I believe I have figured out something it never works, I see a lot of parameters and keys being used in things like tweens and animations that I can’t find anywhere in the docs. Even used command F just to find them, and nope. I’ve spent 8 days literally sitting here on docs and search trying to figure it out. My head is about to explode. If any of you veterans could offer a hand I’d greatly appreciate it.

Here is an example of the ‘press start’ effect I am trying to achieve:

I’d add the code if it really mattered but it’s just the basic setup like in the boilerplate minus the assets from the boilerplate and a different aspect ratio in the config. I can add upon request if anyone is willing to offer a hand and needs it.

Thanks guys!

2 
   this.tweens.add({
      targets: startText,
      alpha: { from: 1, to: 0.5 },
      ease: 'Sine.InOut',
      duration: 500,
      repeat: -1,
      yoyo: true
    });

You can use yoyo property to make your tween go back and forth between from & to values. And to make it run forever you can set repeat to -1.

2 Likes
3

Phaser.Types.Tweens.TweenBuilderConfig

3 Likes
4

Thanks guys!