updateTweenData

[rsadwick]

I've used updateTweenData to change the duration and delay properties.  However if I pass a property like x/y, it doesn't update.  Does updateTweenData only have an effect on properties like duration?  

 

Stepping through the properties that updateTweenData loops through, it has the x property that I set, however the tween object that is returned from updateTweenData doesn't contain the updated value.

 

I'm changing a tween that isRunning when a powerup is applied, so I'm modifying the tween using updateTweenData.  It works great with duration...  is it better to stop the tween and create another when I want to override properties like x, y, tint, etc?

[Maria]

Hi!

 

I am sorry I have no answer to your question, I am new on phaser.

 

But how did you use the updateTweenData? I try to change the speed of a sprite when clicked on, and I do not fully understand the docs about the update.

 

https://phaser.io/docs/2.3.0/Phaser.Tween.html#updateTweenData

 

Thanks and sorry for the hijack

[rsadwick]

I only used it for updating the duration of the tween - I haven't worked on trying to override the x/y/tint properties yet but when I replace "duration" with x or y, it doesn't seem to work even though the properties are returned from updateTweenData.  But the code below works fine with duration

if (this.tween.isRunning) {    this.tween.updateTweenData("duration", someVariable, 1);}

When a player gets a powerup, I slow down the tweening of a boss attack.

[Tom Atom]

Hi, I found how to do it. I am using Typescript which is more restrictive about types and so, but I managed to make it work.

 

updateTweenData has this signature and this important line:

    * @method Phaser.Tween#updateTweenData    * @param {string} property - The property to update.    * @param {number|function} value - The value to set the property to.    * @param {number} [index=0] - If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the delay on all the children.    * @return {Phaser.Tween} This tween. Useful for method chaining.    */    updateTweenData: function (property, value, index) {        :        :        {            this.timeline[index][property] = value;        }        :        :    },

timeline is array of TweenData objects. TweenData object has properties like delay, yoyo, repeatCounter, ... look into TweenData source. But it has no properties like x or y. The values you want to tween are stored in properties, which are defined as object like this:

this.vStart = {};this.vEnd = {};

So, if you want to reuse tween and change values it is tweened to, you have to change this object.

 

My tween looks like this:

            this._updateTween = aGame.add.tween(this);            this._updateTween.to({ _updateValue: 0 }, 10000, Phaser.Easing.Linear.None, false);

I am tweening some custom _updateValue. This is what comes into vEnd: { _updateValue: 0 }  I want to change it from time to time to tween to another value. So I have to pass new properties object into updateTweenData:

this._updateTween.updateTweenData("vEnd", { _updateValue: 500 });

This will work for you if you are using Javascript. But look at updateTweenData description above. In Typescript it is restricted to take number|function as value. So, if you use Typescript + VS you get error in editor. You have to cast it to any and then it will work:

this._updateTween.updateTweenData("vEnd", <any> { _updateValue: 500 });

 While this work I still believe, that you will have to stop, update and start your tween again as even if you change data with above mentioned code it will not take effect while tween is running. The reason is, that start and end values are cached when tween start is called. So, another start has to be called to cache and work with changed properties. On the other hand changing delay or yoyo during tween run will probably work, as this is not property stored in vStart / vEnd and thus it is not cached. You can also try to change cached values directly during tween run in vStartCache / vEndCache, but doing it starts to be pretty wild for me - true Phaser ninjutsu

[Harissa]

For what it's worth I've got this working to change the position that the tween is moving to: In typescript I just use:

dropTween.updateTweenData("vEnd", <any> { x: pos.x, y: pos.y });

where pos is a point containing the new position. I didn't need to pause and resume the tween. It's pretty jerky, I need to work on making it smoother. I tried resetting the tweens percent value to something smaller but it doesn't seem to work. 

 

Update

After playing around with this for a while I get a much smoother result by just stopping the original tween and making a whole new one...

[ForgeableSum]

Interesting the you can't modify a tweens target x/y with tween.updateTweenData. I'm beginning to regret switching my bullet system to use tweens instead of physics! 

Anyone got any other solutions? Adding a new tween each time the x/y changes is too big an impact on performance for me. 

[samme]

I've used something like this. You can use the `remaining` time if you want to simulate the tween running to its previous duration.

var tweenDatum = tween.timeline[tween.current];
var remaining = tweenDatum.duration - tweenDatum.dt;

tween.isPaused = tween.isRunning = false;
tween.timeline.length = 0;
tween.to(/* … */);
tween.start();