Animate CC - Staggering an array of displayObject (solved)

[absolutGob 2 Likes (Newbie)]

Hi guys,

 

I 'm using Animate CC 2017 and i would like to animate one by one childs of a clip, which can be letters for example.

 

I've tried using something like this :

 

tl.staggerFrom(this.myClip.children, 0.6, {x:"-=50", alpha:0}, 0.03, "-=0.8");

but it doesn't works.

 

Does someone using animate CC 2017 know if such a thing is possible ?

 

Thanks for your help. Sorry for my english, it's not my native language.

[Carl 9,758 Likes (Superhero)]

I don't have access to Animate at the moment (machine rebuild) but I remember some issues with addChild and child-related methods on the first frame of the timeline. Just as a test make sure this.myClip.children is something an not undefined. Try adding the following line immediately before the animation code:

 

console.log(this.myClip.children)

 

if you get "undefined" try moving your code to the next frame.

 

[absolutGob 2 Likes (Newbie)]

Thanks Carl for loonking at my problem.

 

This is what i get as you can see in the attached file :

Array(5)
	>0: lib.Symbole4
	>1: lib.Symbole5
	>2: lib.Symbole6
	>3: lib.Symbole7
	>4: lib.Symbole8
	length: 5
	>__proto__: Array(0)

 

It's not an error. It's just like it didn't take in count the array.

The other part of the code works perfectly and when i put manually all the elements it works :

 

tl.staggerFrom([this.retex.p1, this.retex.p2, this.retex.p3, this.retex.p4, this.retex.p5], 1, {scaleX:5, scaleY:5, alpha:0, ease:Bounce.easeOut}, 0.1, "intro")

 

But i've some parents clip with more than 25 elements and can't put them all manually (it's just letters for example).

 

If we can't use animation and stagger on array with animate CC, i serously doubt why should i continue to use it for HTML5 canvas. 

[Carl 9,758 Likes (Superhero)]

this is quite strange and looks like a bug in Animate.

 

If you force your clip to gotoAndStop(0) before the stagger or place your code on frame 2 in the timeline it works.

 

With a single frame I did:

console.log(this.boxes.children);
this.boxes.alpha = 0.5;
this.boxes.gotoAndStop(0)
TweenMax.staggerTo(this.boxes.children, 1, {scaleX:2, scaleY:3}, 0.5);
//this.boxes.box1.scaleX = 4
this.stop();

 

attached is my fla

animate-stagger.fla.zip

[absolutGob 2 Likes (Newbie)]

Oh yeah, I just add a gotoAndStop(0) to my parent clip and it works perfectly.

Thanks for you help Carl, you rock as usual.