How can I use Action Script 3.0 to make random placed Symbols fly by?

Question

I'm trying to make a simple animation with Flash CS4 and Action Script 3.0 to make a number of Symbols fly by from right to left constantly. What I want is that once a symbol has reached the end of the screen it is destroyed and another one is placed at the start position.

I intend to give each symbol a random speed and create a random symbol each time one is 'destroyed'. Any clues where I can start?

Answer 1

First, turn your symbols into MovieClips. Then create a base class MySymbol.as for your symbols, something like:

package {
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.geom.Point;


    public class MySymbol extends MovieClip
    {
        public var speed:Number;        // Pixels moved per frame


        public function MySymbol(speed:Number, startPosition:Point)
        {
            this.speed = speed;
            this.addEventListener(Event.ENTER_FRAME, update);

            this.x = startPosition.x;
            this.y = startPosition.y;
        }


        private function update():void
        {
            this.x -= this.speed;
            if (this.x < 0 - this.width) {      // We're at the left edge
                this.removeEventListener(Event.ENTER_FRAME, update);
                this.dispatchEvent(new Event(Event.COMPLETE));
            }
        }
    }
}

Then make sure your movie clips are exported for AS3 (the "linkage" option on the item in the library). Make the class name for each item unique (e.g. MySymbol1, MySymbol2), and set the base class to MySymbol.

Your document class might look something like this:

package {
    import flash.display.MovieClip;
    import flash.events.Event;
    import MySymbol;                // Not strictly needed

    public class DocumentClass extends flash.display.MovieClip
    {
        private static var SYMBOLS:Array = new Array(MySymbol1, MySymbol2);

        public function DocumentClass()
        {
            // Create five symbols:
            for (var i:int = 0; i < 5; i++) {
                makeSymbol();
            }
        }


        private function makeSymbol():void
        {
            // Pick a random symbol from the array:
            var symType:Class = SYMBOLS[Math.random() * SYMBOLS.length];

            // Construct the new symbol:
            var loc:Point = new Point(stage.stageWidth, Math.random() * stage.stageHeight);
            var sym:MySymbol = new symType(1 + Math.random() * 30, loc);

            // Listen for the object hitting the left edge:
            sym.addEventListener(Event.COMPLETE, remakeObject);
            this.addChild(sym);
        }


        private function remakeObject(e:Event):void
        {
            e.target.removeEventListener(Event.COMPLETE, remakeObject);
            this.removeChild(e.target);

            // Replace the dead symbol:
            makeSymbol();
        }
    }
}

It is a lot more efficient if instead of destroying and re-creating an object that flies off-stage you re-use the existing one and move it back to the right. But this is an optimization you can implement later, if things become slow.

Note that all the code above is UNTESTED and I have not coded AS3 in a while, so there's likely at least a few bugs in it. Hopefully it will serve as a good enough starting point.