Skip to main content
L
Lingeshwaran5F96
Participant
March 6, 2023
Question

Running number

  • March 6, 2023
  • 3 replies
  • 977 views

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

    This topic has been closed for replies.

    3 replies

    Vladin M. Mitov
    Vladin M. Mitov
    Inspiring
    March 6, 2023

    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 1998Member of Flanimate Power Tools team - extensions for character animation
      L
      Lingeshwaran5F96Author
      Participant
      March 7, 2023

      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

      L
      Lingeshwaran5F96Author
      Participant
      March 7, 2023

      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 );
}

       

       

       


      Let me try, Thank you so much

      kglad
      Community Expert
      kgladCommunity Expert
      Community Expert
      March 6, 2023

      does that display indicate anything useful?

      Colin Holgate
      Colin Holgate
      Inspiring
      March 6, 2023

      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.

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices