Highlighted

HTML Canvas tween with a random wait();

Explorer ,
Jul 11, 2019

Copy link to clipboard

Copied

I looking for a more efficient way to tween (alpha) about 50 movieClips all from the same library movieClip with different instance names:

I could dupliacte this 50 times but that would be very efficent

createjs.Tween.get(this.movieClip).wait(200).to({alpha:1}, 400, createjs.Ease.quadOut);

...

...

It would be much better to randomise the number in the wait() parameter and have the instance name have a multiple of a number e.g this.movieclip1 etc

Any help would be appreciated.

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi.

One approach would be to place all of your instances inside of a container and then access the children property of this container to reference each child. Like this:

var root = this;

root.tweenBalls = function(e)

{

    stage.off("drawstart", root.drawStart);

    root.balls.children.forEach(function(ball) // the container is called balls

    {

          ball.alpha = 0;

          createjs.Tween.get(ball).wait(Math.random() * 5000).to({alpha:1}, 400, createjs.Ease.quadOut);

    });

};

root.drawStart = stage.on("drawstart", root.tweenBalls, null, true); // we need the drawstart event so children will be ready to be accessed

Please let me know if this helps you.

Regards,

JC

TOPICS
Discussions

Views

117

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

HTML Canvas tween with a random wait();

Explorer ,
Jul 11, 2019

Copy link to clipboard

Copied

I looking for a more efficient way to tween (alpha) about 50 movieClips all from the same library movieClip with different instance names:

I could dupliacte this 50 times but that would be very efficent

createjs.Tween.get(this.movieClip).wait(200).to({alpha:1}, 400, createjs.Ease.quadOut);

...

...

It would be much better to randomise the number in the wait() parameter and have the instance name have a multiple of a number e.g this.movieclip1 etc

Any help would be appreciated.

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi.

One approach would be to place all of your instances inside of a container and then access the children property of this container to reference each child. Like this:

var root = this;

root.tweenBalls = function(e)

{

    stage.off("drawstart", root.drawStart);

    root.balls.children.forEach(function(ball) // the container is called balls

    {

          ball.alpha = 0;

          createjs.Tween.get(ball).wait(Math.random() * 5000).to({alpha:1}, 400, createjs.Ease.quadOut);

    });

};

root.drawStart = stage.on("drawstart", root.tweenBalls, null, true); // we need the drawstart event so children will be ready to be accessed

Please let me know if this helps you.

Regards,

JC

TOPICS
Discussions

Views

118

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jul 11, 2019 0
Adobe Community Professional ,
Jul 11, 2019

Copy link to clipboard

Copied

Hi.

One approach would be to place all of your instances inside of a container and then access the children property of this container to reference each child. Like this:

var root = this;

root.tweenBalls = function(e)

{

    stage.off("drawstart", root.drawStart);

    root.balls.children.forEach(function(ball) // the container is called balls

    {

          ball.alpha = 0;

          createjs.Tween.get(ball).wait(Math.random() * 5000).to({alpha:1}, 400, createjs.Ease.quadOut);

    });

};

root.drawStart = stage.on("drawstart", root.tweenBalls, null, true); // we need the drawstart event so children will be ready to be accessed

Please let me know if this helps you.

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 11, 2019 1
Explorer ,
Jul 11, 2019

Copy link to clipboard

Copied

Work perfectly

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 11, 2019 1
Adobe Community Professional ,
Jul 11, 2019

Copy link to clipboard

Copied

Excellent!

You're welcome!

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 11, 2019 0