Search code examples
actionscript-3

Expanding circle animation in AS3


I am using an array to create an expanding circle animation in Action Script 3. Drawing a new circle element and deleting the previous one, all led by a timer. The code, at present, is drawing the new circle element but not deleting the previous one. The output, at present,is a bunch of 30 circles. Please help.

The following is the class for creating the circles:

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

    public class SoundWave2 extends Sprite
    {
        public function SoundWave2()
            {
                var wavearray:Array = new Array();
                var waveTimer:Timer = new Timer(1000, 30);
                var i:int = new int(0);
                waveTimer.addEventListener(TimerEvent.TIMER, init);
                waveTimer.start();

                function init():void
                            {
                                if (i == 0)
                                    {
                                        wavearray[i] = graphics.lineStyle(1, 0x0000FF);
                                        wavearray[i] = graphics.drawCircle(0, 0, 30);
                                        i += 1;
                                        trace(i);
                                    }

                                    else
                                    {
                                        wavearray[i] = graphics.lineStyle(1, 0x0000FF);
                                        wavearray[i] = graphics.drawCircle(0, 0, 30 + i);
                                        wavearray.removeAt(i-1);
                                        i += 1;
                                        trace(i);
                                    }

                            }



        }
    }
}

Solution

  • waveArray.removeAt...
    

    That may or may not remove it from the array but doesn't remove it from the stage

    Instead of using an array of circles, just use the same circle and redraw it being sure to call the clear function first.

    myCircle.graphics.clear();
    myCircle.graphics.beginFill...
    ...drawCircle(...);
    

    That's just some pseudo code but you get the idea.

    edit

    As you asked for additional info on removing all array elements from the stage:

    private function destroyArray(arr:Array):void{
        for (var i:int = 0; i < arr.length; i++){
            arr[i].parent.removeChild[arr[i]];
        }
    }
    

    Then for any array you want to take off the stage, do

    destroyArray(yourArray);
    

    but use your desired array in place of "yourArray", obviously.