Videotutorial: Creación de menús en Flash con AS3

En esta ocasión vamos a ver como generar un menú de botones a partir de la clase Button que creamos en el tutorial pasado.

Este menú, puede ser horizontal o vertical, podemos indicar el espacio entre cada botón y además si queremos que el botón quede seleccionado.

Archivos del Tutorial en:
http://www.megaupload.com/?d=L4PKWF50

Crear menú de navegación en Flash CS5 con AS3

Código del proyecto:

Menu.as

Código :

package ar.com.lucasmoyano.menus
{
   import flash.display.MovieClip;
   import flash.events.Event;
   import flash.events.MouseEvent;

   public class Menu extends MovieClip
   {      
      private var items:Array;
      private var category:Boolean;
      private var horizontal:Boolean;
      private var space:int;
      
      public function Menu(_horizontal:Boolean, _space:int, _category:Boolean, ...args):void
      {
         addEventListener(Event.ADDED_TO_STAGE, onAddedStage);
         horizontal = _horizontal;
         space = _space;
         category = _category;
         items = args;
      }
      
      private function onAddedStage(e:Event):void
      {
         var totalSpace:int = 0;
         if (category)
            addEventListener(MouseEvent.CLICK, clickItems);
            
         for (var i:int; i < items.length; i++)
         {
            if (horizontal)
            {
               items[i].x = totalSpace;
               totalSpace += items[i].width + space;
            }
            else
            {
               items[i].y = totalSpace;
               totalSpace += items[i].height + space;
            }
            addChild(items[i]);
         }
      }         
      
      private function clickItems(e:MouseEvent):void
      {
         try
         {
            for (var i:int = 0; i < items.length; i++)
            {
               if (items[i].Content.currentFrame == items[i].Content.totalFrames && items[i].Content.name != e.target.name)
               {
                  items[i].Content.gotoAndStop(1);
               }
            }
         }
         catch (error:Error)
         {
            trace("Class Menu - Error: The buttons need a MovieClip with 'Content' name");
         }
      }
      
      public function get Items():Array
      {
         return items;
      }
      
      public function set Items(value:Array):void
      {
         items = value;
      }      
      
      public function get Category():Boolean
      {
         return category;
      }
      
      public function set Category(value:Boolean):void
      {
         category = value;
      }      
      
      public function get Horizontal():Boolean
      {
         return horizontal;
      }
      
      public function set Horizontal(value:Boolean):void
      {
         horizontal = value;
      }      
      
      public function get Space():int
      {
         return space;
      }
      
      public function set Space(value:int):void
      {
         space = value;
      }
   }
}

MenuButton.as

Código :

package ar.com.lucasmoyano.buttons
{
   import flash.display.MovieClip;
   import flash.media.Sound;
   import flash.events.MouseEvent;
   import flash.events.Event;
   import ar.com.lucasmoyano.buttons.Button;
   
   public class MenuButton extends Button
   {      
      public function MenuButton(_content:MovieClip = null, _soundMouseUp:Sound = null, _soundMouseOver:Sound = null, 
                        _soundMouseOut:Sound = null, _soundMouseDown:Sound = null):void
      {
         super(_content, _soundMouseUp, _soundMouseOver, _soundMouseOut, _soundMouseDown);
      }
      
      protected override function onMouseDown(e:MouseEvent):void
      {
         if (Content.currentFrame != Content.totalFrames)
         {
            super.onMouseDown(e);
         }
      }
      
      protected override function onMouseUp(e:MouseEvent):void
      {
         if (Content.currentFrame != Content.totalFrames)
         {
            super.onMouseUp(e);
         }
      }
      
      protected override function onEnterFrame(e:Event):void
      {               
         super.onEnterFrame(e);            
         if (Content.currentFrame == Content.totalFrames)
         {
            Content.removeEventListener(Event.ENTER_FRAME, onEnterFrame);      
            Content.stop();
         }
      }      
   }
}

Button.as:

Código :

package ar.com.lucasmoyano.buttons
{
   import flash.display.MovieClip;
   import flash.events.Event;
   import flash.events.MouseEvent;
   import flash.media.Sound;

   public class Button extends MovieClip
   {
      private var content:MovieClip;
      private var indexPressed:int;
      private var flag:Boolean;
      private var soundMouseOver:Sound;
      private var soundMouseOut:Sound;
      private var soundMouseDown:Sound;
      private var soundMouseUp:Sound;
      
      public function Button(_content:MovieClip = null, _soundMouseUp:Sound = null, _soundMouseOver:Sound = null, 
                        _soundMouseOut:Sound = null, _soundMouseDown:Sound = null):void
      {
         addEventListener(Event.ADDED_TO_STAGE, onAddedStage);
         content = _content;
         soundMouseOver = _soundMouseOver;
         soundMouseOut = _soundMouseOut;
         soundMouseDown = _soundMouseDown;
         soundMouseUp = _soundMouseUp;
         flag = false;
      }
      
      private function onAddedStage(e:Event):void
      {
         content.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
         try
         {
            indexPressed = content.currentLabels[0].frame;
         }
         catch (error:Error)
         {
            trace("Class Button - Error: In the MovieClip content, enter a label name to Frame");
         }
         content.mouseChildren = false;
         content.buttonMode = true;
         content.stop();
         addChild(content);
      }
      
      protected function onMouseOver(e:MouseEvent):void
      {
         content.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
         content.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
         content.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
         flag = true;
         if (content.currentFrame == 1)
            content.addEventListener(Event.ENTER_FRAME, onEnterFrame);
         if (soundMouseOver != null)
            soundMouseOver.play();
      }
      
      protected function onMouseOut(e:MouseEvent):void
      {
         content.removeEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
         content.removeEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
         content.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp);
         flag = false;
         if (soundMouseOut != null)
            soundMouseOut.play();
      }
      
      protected function onMouseDown(e:MouseEvent):void
      {
         content.gotoAndStop(indexPressed);   
         if (soundMouseDown != null)
            soundMouseDown.play();   
      }
      
      protected function onMouseUp(e:MouseEvent):void
      {
         content.play();
         if (soundMouseUp != null)
            soundMouseUp.play();
      }
      
      protected function onEnterFrame(e:Event):void
      {               
         if (content.currentFrame < indexPressed)
         {
            if (flag)
            {
               if (content.currentFrame < indexPressed - 1)
                  content.nextFrame();
            }
            else
               content.prevFrame();
         }
         
         if (content.currentFrame == 1)
            content.removeEventListener(Event.ENTER_FRAME, onEnterFrame);            
      }
      
      // GETTERS AND SETTERS      
      public override function get width():Number
      {
         return Content.width;
      }
      
      public override function get height():Number
      {
         return Content.height;
      }
      
      public function get Content():MovieClip
      {
         return content;
      }
      
      public function set Content(value:MovieClip):void
      {
         content = value;
      }
      
      public function get SoundMouseOver():Sound
      {
         return soundMouseOver;
      }
      
      public function set SoundMouseOver(value:Sound):void
      {
         soundMouseOver = value;
      }
      
      public function get SoundMouseOut():Sound
      {
         return soundMouseOut;
      }
      
      public function set SoundMouseOut(value:Sound):void
      {
         soundMouseOut = value;
      }
      
      public function get SoundMouseDown():Sound
      {
         return soundMouseDown;
      }
      
      public function set SoundMouseDown(value:Sound):void
      {
         soundMouseDown = value;
      }
      
      public function get SoundMouseUp():Sound
      {
         return soundMouseUp;
      }
      
      public function set SoundMouseUp(value:Sound):void
      {
         soundMouseUp = value;
      }
   }
}