Jump to content

Let every single tween start after the other one completes


bymafmaf
 Share

Recommended Posts

Hi,

 

In the game I don't know how many tweens will happen because it depends on how player plays it. I have four tween adding function but they work in loop. So, there might be 4 or more tweens but I wrote 4 in the code.

 

What I want to do is having some delay between each tween. When I add to every one of them, like 100 200 300 400 it works but every element of the same group start at the same time, as expected. But I want every single tween to have delay.

 

I thought TweenManager could help but documentation doesn't say so. I'd appreciate if you can help..

Link to comment
Share on other sites

Hi, could you post some code to show how exactly you are adding the tween delays currently? From what I understand, you are not exactly adding delays, you are just setting their tween durations to be of different lengths (e.g., 100, 200, 300, 400) - which means that everything will start at the same time, but end 100 msecs apart from one another.

 

All Tweens in Phaser can have a delay - if you look at the docs for Phaser.Tween.to(). 

 

 

to(properties, durationeaseautoStartdelayrepeatyoyo) → {Phaser.Tween}

Sets this tween to be a to tween on the properties given. A to tween starts at the current value and tweens to the destination value given. For example a Sprite with an x coordinate of 100 could be tweened to x 200 by giving a properties object of { x: 200 }. The ease function allows you define the rate of change. You can pass either a function such as Phaser.Easing.Circular.Out or a string such as "Circ". ".easeIn", ".easeOut" and "easeInOut" variants are all supported for all ease types.

Link to comment
Share on other sites

var destroyMe = Kare.gameBoard[i][j];var tween = destroyMe.game.add.tween(destroyMe.scale).to({ x: 0.1, y: 0.1}, 500, Phaser.Easing.Back.Out, true, 100);                    tween.onComplete.add(function (obj, tween, destroyMe) {                        destroyMe.destroy();                                                }, this, null, destroyMe);

I have 4 of this in different loops. Parameter that is stated as delay is where I put 100. It is 200,300 and 400 for other three. The problem is I define a number of destroyMe in every loop. For example in first loop 4 or 16 is initiated. And they have tween as group and same delay, becuase the code for every element in the loop is no different, other four loops have their own delay. What I want is to put delay between every single tween that's gonna happen.

 

I thought there might be an object that controls every tween, so I can say to it to put delay between each tween.

Link to comment
Share on other sites

I thought there might be an object that controls every tween, so I can say to it to put delay between each tween.

There is the Phaser.TweeManager that I believe is what you're looking for.

 

I'm really sorry, but I'm still not entirely clear what you're trying to achieve based on your explanation, so I might be wrong. But if you are initiating 4 or 16, perhaps you could do something like:

for (var i=0; i < 4; i++) {  var tween = destroyMe.game.add.tween(destroyMe.scale).to({ x: 0.1, y: 0.1}, 100 + i*100, Phaser.Easing.Back.Out, true, 100);  tween.onComplete.add(function (obj, tween, destroyMe) {    destroyMe.destroy();  }, this, null, destroyMe);} 

Wouldn't that achieve what you want - which is to stagger the tweens?

Link to comment
Share on other sites

Yeah, I looked up for Phaser.TweenManager but it doesn't give me functionality that I want. What I wanted was simply put a delay between every single tween.

 

Your solution gave me an idea, multiplying delay with the loop variable, I've used it but in a little bit different way. Anyway, thanks!

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...