pixijs / spine

Pixi.js plugin that enables Spine support.
Other
564 stars 217 forks source link

tweenmax (not an issue just a conversation) #164

Open macguffin opened 7 years ago

macguffin commented 7 years ago

Hi Ivan wondered if you ever used Tweenmax, one of my all time favorite libraries.

Was just messing around with your spine stuff and it works really well with Tweenmax as the driver for the delta time update.

I set autoUpdate to false and then created a TimelineMax timeline. All this is doing is calling your update(dt) function.

 let _local_spine_tl: TimelineMax = new TimelineMax({repeat: -1});
                _local_spine_tl.lasttime = 0;
                _local_spine_tl.eventCallback("onUpdate", () => {
                    SPINE.update(_local_spine_tl._totalTime - _local_spine_tl.lasttime)
                    _local_spine_tl.lasttime = _local_spine_tl._totalTime;
                });

The really cool thing about it is that you can now easily slow down the animation, pause it, even reverse it:

slow the animation down over 2 seconds:

TweenMax.to(_local_spine_tl, 2, { timeScale: 0.1})

stop the animation

_local_spine_tl.stop()

play the animation in reverse - back to zero:

_local_spine_tl.reverese

If you have lots of animations you can update them from a single timeline, or you can create a timeline for each spine animation if you want them to be independent.

Thanks Matt

ivanpopelyshev commented 7 years ago

Nice! Spine with tweens.. BWAHAHAHAHA, I need to think, I wont close this thread.