• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Running number

New Here ,
Mar 06, 2023 Mar 06, 2023

Copy link to clipboard

Copied

How to create a running number from 0 to 75% in adobe animate cc

Views

470

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
community guidelines
LEGEND ,
Mar 06, 2023 Mar 06, 2023

Copy link to clipboard

Copied

There are various ways to show a text display of progress, but a different approach would be to use a MovieClip that has 100 frames in it, and then you send that MovieClip to the frame that matches the current percentage.

The frames could simply have the numbers in them, but it could be a gauge filling in, or a much more complex animation of something being completed. That might be more entertaining that a textfield with a number in it.

Votes

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
community guidelines
Community Expert ,
Mar 06, 2023 Mar 06, 2023

Copy link to clipboard

Copied

does that display indicate anything useful?

Votes

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
community guidelines
Engaged ,
Mar 06, 2023 Mar 06, 2023

Copy link to clipboard

Copied

You can just tween a value and display the numbers in a text field.
Open a new HTML5 project, create a dynamic text field, called myTextField and put this code on frame 1:

 

this.stop();

var _this = this;
var tweenableObject = { value:0 };

var tween = createjs.Tween.get( tweenableObject, {onChange:handleChange} )
.wait( 2000 )
.to( {value:75 }, 2000 );



function handleChange( event ) {
   _this.myTextField.text = Math.round( event.target.target.value ).toString();
}

 



- Vlad: UX and graphic design, Flash user since 1998
Member of Flanimate Power Tools team - extensions for character animation

Votes

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
community guidelines
New Here ,
Mar 07, 2023 Mar 07, 2023

Copy link to clipboard

Copied

Thank you so much it works, one more small help, Iam trying to find pie chart with number running in adobe animate, but i couldnd find any. Sample below

infographic-element-in-after-eff.jpg

Votes

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
community guidelines
Engaged ,
Mar 07, 2023 Mar 07, 2023

Copy link to clipboard

Copied

Unfortunately, there are no pre-built components suitable for data visualization in Animate.

In that case, it might be a good idea to follow @Colin Holgate's  suggestion. Prepare an animated movieclip whose timeline shows the change in numbers and animation in 100 frames, after which you can create and control its instances independently with Tween class. The only changes in the handler function should be:

 

function handleChange( event ) {
    var f = Math.round( event.target.target.value )-1;
    _this["myMovieClipInstancename"].gotoAndStop( f );
}

 

 

 

- Vlad: UX and graphic design, Flash user since 1998
Member of Flanimate Power Tools team - extensions for character animation

Votes

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
community guidelines
New Here ,
Mar 07, 2023 Mar 07, 2023

Copy link to clipboard

Copied

LATEST

Let me try, Thank you so much

Votes

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
community guidelines