Counter in Flash and Tweener as3

Question

My scrolling counter is not displaying 1-9...only “zeros” every ten intervals. It plays, but the code is unfinished at line 37 in NumbersView.as. Notice Tweener is used to display the sprites. How do I finish this?

WHAT I'M TESTING "NumbersView.as"
loop error, onComplete, missing argument or function

- Tweener code, line 37?
- for loop, line 22? for (var i:Number = 0; i < 9; i++)

Thanks for the help!

numbers.fla

NumbersView.as "see Tweener part towards the bottom"

package  
{
 import flash.display.DisplayObject;
 import flash.display.MovieClip;
 import flash.utils.Dictionary;
 import flash.events.Event;
 import caurina.transitions.Tweener;


 public class NumbersView extends MovieClip
 {

  private var _listItems:Array = new Array();


  public function NumbersView() 
  {
   var item:NumberImage;
   for (var i:Number = 0; i < 9; i++) {
    item = new NumberImage();
    addChild(item);
    item.x = i * item.width;
    _listItems.push(item);
   }

  }


  public function setTime($number:String):void {
   var nums:Array = $number.split("");
   for (var i:Number = 0; i < nums.length; i++) {
    if (int(nums[i]) == 0) {
     Tweener.removeTweens(_listItems[i].moveableNumber_mc);
     if (_listItems[i].moveableNumber_mc.y < 0) {
      _listItems[i].moveableNumber_mc.y = 120;
     }
     Tweener.addTween(_listItems[i].moveableNumber_mc, { y: 0, time:.3 } );
    } else {
     Tweener.addTween(_listItems[i].moveableNumber_mc, { y: -120 * int(nums[i]), time:.3} );
    }
   }
  }
 }

}

NumberDocumentClass.as "works fine"

package {
 import flash.display.Sprite;
 import flash.utils.Timer;
 import flash.events.TimerEvent;

 public class NumberDocumentClass extends Sprite {

  private var timer:Timer = new Timer(10);
  private var count:int = 0;
  private var fcount:int = 0;
  private var numbers:NumbersView;

  public function NumberDocumentClass() {
   timer.addEventListener(TimerEvent.TIMER, incrementCounter);    
   timer.start();   
   numbers = new NumbersView();
   addChild(numbers);
  }

  function incrementCounter(event:TimerEvent) {    
   count++;    
   fcount=int(count*count/1000);//starts out slow... then speeds up   
   numbers.setTime(formatCount(fcount));
  }  

  function formatCount(i:int):String {   
   return ("000000000" + i).substr(-9, 9); 
  } 
 }
}

I got it debugged!

Answer 1

I noticed a few things in your code, so I edited it and it works fine.

The main problem is that you Flash library item (mc-NumberImage) wasn't set up for the way you were using it. You put the number graphics on frames, so I modified it so the movieclip has one frame with all the numbers on top of each other. So number_0.y = 0, and number_1.y = 120... number_2.y = 240, etc. (also In your library your "number_8.jpg" is actually a number 7).

If you just make that change then your code runs OK. It does get slower and slower though. This is partly due to Tweener, but mostly because it is trying to update too much. I updated you code below.

NumberDocumentClass

Separated out the incrementCounter, and the display code. So now numbers.setTime() gets called on enterframe (no point drawing more than once a frame, Flash can't do it). I also initiated your Timer in the constructor rather than in the variable declaration (this is best practice).

package {
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.utils.Timer;
    import flash.events.TimerEvent;

    public class NumberDocumentClass extends Sprite {

        private var timer:Timer;
        private var count:int = 0;
        private var fcount:int = 0;
        private var numbers:NumbersView;

        public function NumberDocumentClass() {
            timer = new Timer(10);
            timer.addEventListener(TimerEvent.TIMER, incrementCounter);    
            timer.start();   
            numbers = new NumbersView();
            addChild(numbers);

            addEventListener(Event.ENTER_FRAME, enterFrameHandler);
        }

        private function incrementCounter(event:TimerEvent) {    
            count++;    
            fcount=int(count*count/1000);//starts out slow... then speeds up
        }

        private function formatCount(i:int):String {   
            return ("000000000" + i).substr(-9, 9);
        }

        private function enterFrameHandler(e:Event):void 
        {
            numbers.setTime(formatCount(fcount));
        }
    }
}

NumberView

I mainly edited the setTime method. I added a previousNums variable that remembers the previous numbers, that way we can use it to see if a number has changed, and if it hasn't then you can skip it (if(nums[i] == previousNums[i]) continue;).

package  
{
    import flash.display.DisplayObject;
    import flash.display.MovieClip;
    import flash.utils.Dictionary;
    import flash.events.Event;
    import caurina.transitions.Tweener;

    public class NumbersView extends MovieClip
    {
        private var _listItems:Array;
        private var previousNums:Array;
        private const numHeight:int = 120;

        public function NumbersView() 
        {
            _listItems = new Array();
            previousNums = new Array();

            var item:NumberImage;
            for (var i:Number = 0; i < 9; i++) {
                item = new NumberImage();
                addChild(item);
                item.x = i * item.width;
                _listItems.push(item);
            }
        }

        public function setTime($number:String):void {
            var nums:Array = $number.split("");

            for (var i:Number = 0; i < nums.length; i++) {
                if (nums[i] == previousNums[i]) continue;
                Tweener.removeTweens(_listItems[i]);

                var newY:int = int(nums[i]) * -numHeight;
                if (_listItems[i].y < 0) _listItems[i].y = numHeight;
                Tweener.addTween(_listItems[i], { y:newY, time:.1 } );
            }
            previousNums = nums;
        }
    }
}

So if you set up your FLA with the number graphics aligned vertically, and you use this code, then it should run really well.