0 Replies Latest reply on Mar 3, 2010 10:42 AM by Christopher McArthur

    Trouble with ProgressBar Timing and manual updates

    Christopher McArthur Level 1

      This question was crossposted to [flexcoders] yesterday.

       

      Using Flex3 in AIR standalone application.

       

      I have a ton of children I need to add to a Canvas dynamically. When I do this, it takes a long time. So I wanted to display a loading bar to the user.

       

      I create a Timer, and every time the timer ticks, I update the loadingBar and I add the child. I also update a textField with the loading progress as a debug tool.

       

      What I find is that the textField _always_ updates correctly in realtime, but USUALLY the progress bar does NOT update at all until the entire sequence is finished. If I make the tick time long enough, then the progress bar works, but this time seems very dependent on performance of the individual machine.

       

      My question is, how do I know what the lowest possible tick time I can use to make the progress bar update correctly is? Why does it work with the Text field just fine? Or is there a better pattern I could be using to do this correctly?

       

      As you can see from the code, I tried some things like "updateAfterEvent" and "invalidateDisplayList" to see if I could get it to update faster,  ive also tried using a "callLater" on the addChild portion,  but those did not work. (unless I set the tick time high).

       

      code here:

       

      private var pendingElementsToAdd:Array;

      private var totalElementstoAdd:int;

      private static const TIME_BETWEEN_ADDS:Number = 20;

       

           

      private function addElements(newElements:Array):void

      {

            this.pendingElementsToAdd = newElements;

            this.totalElementstoAdd = this.pendingElementsToAdd.length;

            var newEventTimer:Timer = new Timer(TIME_BETWEEN_ADDS, newElements.length);

            newEventTimer.addEventListener(TimerEvent.TIMER, onTimerAddNewElement);

            newEventTimer.addEventListener(TimerEvent.TIMER_COMPLETE, finishAddingElements);

            newEventTimer.start();

      }

       

      private function onTimerAddNewElement(event:TimerEvent):void

      {                

                        this.loadingBar.setProgress(this.totalElementstoAdd - this.pendingElementsToAdd.length, this.totalElementstoAdd);

                        this.loadingText.text = "Elements To Load: " + this.pendingElementsToAdd.length;

                       

                        event.updateAfterEvent();

                        this.loadingBar.invalidateDisplayList();

                       

                        this.addChild(this.pendingElementsToAdd.pop());

      }