Skip to main content
Participant
November 22, 2018
Answered

Animated counter - How do I use actionscript?

  • November 22, 2018
  • 2 replies
  • 2988 views

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 has been closed for replies.
Correct answer isaact40474868

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.

2 replies

isaact40474868AuthorCorrect answer
Participant
December 6, 2018

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.

JoãoCésar17023019
Community Expert
Community Expert
December 6, 2018

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

JoãoCésar17023019
Community Expert
Community Expert
November 22, 2018

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

Participant
November 23, 2018

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?