Skip to main content
Participant
Nov 22, 2018 7:08 AM UTC
Answered

Animated counter - How do I use actionscript?

Hello there,

I know this question has been asked before. I'm animating a video and at one specific point a number appears which I'd like to count up, it wouldn't be triggered by a button, it would just start counting when it appeared on the screen.

I know the code to do this has been posted on this forum before but I'm unsure as how to actually utilise it? I'm in no way a coder so I'm animating primarily from the timeline and there seems to be a lot of things I have to do before I even use the code.

If anyone's answered this question before and can provide help again it would be greatly appreciated.

This topic is closed to new replies. Start a new post to keep the conversation going.
isaact40474868Correct answer
Participant
Dec 6, 2018 2:10 AM UTC

I've finally gotten it to work thanks to my web designer colleague who spent a long time teaching himself about actionscript on the fly.

This is the code that managed to actually do what I needed to, incorporating the layer name into the code seemed to make it work, that's possibly what I was supposed to do in the first place but this is what worked:

import fl.transitions.Tween;

import fl.motion.easing.*;

import fl.transitions.TweenEvent;

function tweenCount(scope:Object, start:Number, end:Number, duration:Number, ease:Function, updateCallback:Function = null, finishCallback:Function = null):void

{

    scope.count = 0;

    var tween:Tween = new Tween(scope, "count", ease, start, end, duration, true);

    if (updateCallback != null)

          tween.addEventListener(TweenEvent.MOTION_CHANGE, function():void{updateCallback(scope.count);});

    if (finishCallback != null)

          tween.addEventListener(TweenEvent.MOTION_FINISH, function():void{finishCallback(scope.count);});

}

tweenCount(this, 1500000, 2000000, 1, Linear.easeInOut, function(count:Number):void{Layer_4.txt0.text = uint(count)}, function(count:Number):void{trace("txt0 finished at: ", count);})

This was placed in the first frame I wanted the animation to trigger, and then in subsequent frames when I wanted the number to increase I copied the final line and changed the values.

5 replies

isaact40474868AuthorCorrect answer
Participant
Dec 6, 2018 2:10 AM UTC

I've finally gotten it to work thanks to my web designer colleague who spent a long time teaching himself about actionscript on the fly.

This is the code that managed to actually do what I needed to, incorporating the layer name into the code seemed to make it work, that's possibly what I was supposed to do in the first place but this is what worked:

import fl.transitions.Tween;

import fl.motion.easing.*;

import fl.transitions.TweenEvent;

function tweenCount(scope:Object, start:Number, end:Number, duration:Number, ease:Function, updateCallback:Function = null, finishCallback:Function = null):void

{

    scope.count = 0;

    var tween:Tween = new Tween(scope, "count", ease, start, end, duration, true);

    if (updateCallback != null)

          tween.addEventListener(TweenEvent.MOTION_CHANGE, function():void{updateCallback(scope.count);});

    if (finishCallback != null)

          tween.addEventListener(TweenEvent.MOTION_FINISH, function():void{finishCallback(scope.count);});

}

tweenCount(this, 1500000, 2000000, 1, Linear.easeInOut, function(count:Number):void{Layer_4.txt0.text = uint(count)}, function(count:Number):void{trace("txt0 finished at: ", count);})

This was placed in the first frame I wanted the animation to trigger, and then in subsequent frames when I wanted the number to increase I copied the final line and changed the values.

Translate
JoãoCésar17023019
Community Expert
Community Expert
Dec 6, 2018 1:37 PM UTC

Hi.

It probably didn't work for you because you're using the advanced layers mode. That's why you have to reference the layer first.

My file is not using the advanced layers mode.

Regards,

JC

Translate
JoãoCésar17023019
Community Expert
Community Expert
Nov 22, 2018 12:28 PM UTC

Hi.

I remember these two codes that do what you want:

AS3

Re: Creating a counting up total in Animate

HTML5

Re: Creating a counting up total in Animate

To use them do the following:

- Create or open up a document (I recommend a AS3 document type if your intended output is video);

- In the main timeline, create a layer called AS3 or give any other name of your choice;

- Select the first frame of this layer;

- Open up the Actions panel by pressing F9 (Win) / Option + F9 (Mac);

- Paste in the code from one of the links:

AS3:

import fl.transitions.Tween;

import fl.motion.easing.*;

import fl.transitions.TweenEvent;

function tweenCount(scope:Object, start:Number, end:Number, duration:Number, ease:Function, updateCallback:Function = null, finishCallback:Function = null):void

{

     scope.count = 0;

     var tween:Tween = new Tween(scope, "count", ease, start, end, duration, true);

     if (updateCallback != null)

          tween.addEventListener(TweenEvent.MOTION_CHANGE, function():void{updateCallback(scope.count);});

     if (finishCallback != null)

          tween.addEventListener(TweenEvent.MOTION_FINISH, function():void{finishCallback(scope.count);});

}

- Then, in every frame you have a text field you want to animate, place this code and change the values to best suit your needs:

tweenCount(this, 0, 1000, 5, Linear.easeInOut, function(count:Number):void{txt0.text = "COUNTER: " + uint(count)}, function(count:Number):void{trace("txt0 finished at: ", count);});

- The procedure with HTML5 documents is similar.

Here is a sample to better demonstrate the process:

animate_cc_as3_counter_3.zip - Google Drive

Please let us know if you still have any questions.

Regards,

JC

Translate
Participant
Nov 23, 2018 1:00 AM UTC

Thank you for replying! I'm looking at the example you provided but I can't seem to get the counter animation to work. Am I mean to do something to the code to get it to play?

Translate