How to reset/restart multiple animations in one animationGroup

[dingoogle]

Hi Guys,

I got a problem when trying to reset/restart an animationGroup with multiple animations in it. Looks the animations can't reset together by animationGroup.

I've tried several ways as below but none of them worked well.  Your kind help will be highly appreciated.

1. create AnimationEvent at the end frame, PB https://www.babylonjs-playground.com/index.html#9DDUHI

2. add callback to onAnimationEndObservable.add() function, PB https://www.babylonjs-playground.com/index.html#9DDUHI#2

3. add callback to onAnimationEndObservable.addOnce() function, PB https://www.babylonjs-playground.com/index.html#9DDUHI#3

 

 

[SinhNQ]

Hi,

I think this is bug (not sure) but you can use tricks by set _isStarted = false ?

Fixed: https://www.babylonjs-playground.com/index.html#9DDUHI#4

[RaananW]

I agree that this is a bug.

The onAnimationEnd should only be triggered once (i would assume) and isStarted should be set to false when all animations ended.

This would be my solution - (very similar to yours, just using public methods?

https://www.babylonjs-playground.com/index.html#9DDUHI#5

[dingoogle]

1 hour ago, SinhNQ said:

Hi,

I think this is bug (not sure) but you can use tricks by set _isStarted = false ?

Fixed: https://www.babylonjs-playground.com/index.html#9DDUHI#4

Hi SinhNQ, thank you for your reply. "_isStarted" works well in JS. But unfortunately my project is coded in strict TypeScript , "_isStarted" is private and "isStarted" is readonly.  I can't make it pass verification when compiling. Hope the "bug" could be  fixed soon .

BTW, is there any suggestion to create a "timeline" like Adobe Flash CC or 3DSMax? My thought is creating a global animation with default length, let's say 500 frames, adding key frames and expanding length dynamically. This animation should be assigned to a "pseudo" mesh to provide current and total frames when animating. Can set playback head, be sought, paused, restarted etc.

If there's any better practice please let me know. thanks!

[dingoogle]

47 minutes ago, RaananW said:

I agree that this is a bug.

The onAnimationEnd should only be triggered once (i would assume) and isStarted should be set to false when all animations ended.

This would be my solution - (very similar to yours, just using public methods?

https://www.babylonjs-playground.com/index.html#9DDUHI#5

Hi RaananW, just saw your reply, thanks, It should work in TypeScript. Agree that onAnimationEnd should only be triggered once. Hope the observable in babylon.js could be something like rxjs.

[RaananW]

being fixed  

https://github.com/BabylonJS/Babylon.js/issues/4341

[SinhNQ]

34 minutes ago, dingoogle said:

BTW, is there any suggestion to create a "timeline" like Adobe Flash CC or 3DSMax? My thought is creating a global animation with default length, let's say 500 frames, adding key frames and expanding length dynamically. This animation should be assigned to a "pseudo" mesh to provide current and total frames when animating. Can set playback head, be sought, paused, restarted etc.

I recommend you use GreenSock API - the best framework for HTML5 Animation. I been used more than 3 year for 2D and 3D projects. ?

[dingoogle]

15 hours ago, SinhNQ said:

I recommend you use GreenSock API - the best framework for HTML5 Animation. I been used more than 3 year for 2D and 3D projects. ?

Thanks, I'll do some investigation.