Botones con parámetros en Actionscript 3

Este es un código de ejemplo muy sencillo de cómo asignar funciones con parámetros a botones dinámicamente con un bucle for(); en Actionscript 3.

Este era un recurso muy utilizado en Actionscript 2 cuando teníamos varios botones con nombres con una secuencia numérica (ej: boton1, boton2, boton3 etc..)

Código :

for (var i:Number = 1; i <= 5; i++)
{
   this["boton" + i].num = i;
   this["boton" + i].onRelease = function()
   {
      trace("Soy el botón " + this.num);
   };
}

Hacíamos un típico scope colocando el parámetro (en este caso la variable "num") dentro del objeto botón, y luego el la función que ejecuta el evento onRelease (o el que sea). De esta manera con un this podíamos recuperar ese parámetro y con un if() o un switch() ejecutabamos las funciones correspondientes a cada botón.

En Actionscript 3 no podemos asignar directamente el parámetro al botón ya que nos lanzaría un error:

Código :

ReferenceError: Error #1056: No se puede crear la propiedad num en flash.display.SimpleButton.

¿Cómo podemos hacerlo ahora?

Una solución rápida es recuperar el valor númerico del botón a partir del nombre del clip:

Código :

for (var i:Number = 1; i <= 5; i++)
{
   this["boton" + i].addEventListener(MouseEvent.MOUSE_UP,clicBoton);
}
function clicBoton(e:MouseEvent)
{
   var nombre:String = e.currentTarget.name;
   var num:uint = uint(nombre.replace("boton", ""));
   
   trace("Soy el botón " + num);
}

Únicamente recuperamos el nombre del botó clicado y eliminamos el String "boton" con lo que nos queda el numero correspondiente.

Otra opción algo más laboriosa pero que nos permite más control de los parámetros en códigos más complejos sería crearnos una clase que extienda de simpleButton que permita lanzar listeners con parámetros.

Código :

package 
{
   import flash.events.EventDispatcher;
   import flash.events.MouseEvent;
   import flash.display.SimpleButton;
      //-------------------------------------------------
   public class BotonScope extends SimpleButton 
   {
      private var _boton:SimpleButton;
      private   var _param:Object;
      private   var _listener:Function;
      //-------------------------------------------------
      public function BotonScope(b:SimpleButton,p:Object)
      {
         _boton=b;
         _param=p;
      }
      //-------------------------------------------------
      override public function addEventListener(type:String,
                     listener:Function, 
                     useCapture:Boolean = false,
                     priority:int = 0, 
                     useWeakReference:Boolean = false):void 
      {
         _listener = listener
         _boton.addEventListener(type,listenerParam,useCapture,
                     priority,useWeakReference);
      }
      private function listenerParam(e:MouseEvent)
      {
         _listener(e,_param);
      }
      //-------------------------------------------------
   }
}

Esta clase simplemente extiende de simpleButton y recibe como parámetro el objeto simpleButton que tengamos colocado en el timeline y también incluiremos un objeto que contendrá los parámetros que nos interesen.

Sobrescribiremos con override la function addEventListener. Lo que haremos es que el listenr ejecute la función interna de la clase que en realidad lo unico que hace es ejecutar la función asignada desde el timelime pero pasandole el objeto con los parámetros:

Código :

_listener(e,_param);

Desde el timeline asignaremos los listeners de esta manera:

Código :

import BotonScope;

for (var i:Number = 1; i <= 5; i++)
{
   var param:Object = new Object();
      param.num = i;
      
   var boton:BotonScope = new BotonScope(this["boton" + i],param);
      boton.addEventListener(MouseEvent.MOUSE_UP,clicBoton);
}

function clicBoton(e:MouseEvent,param:Object)
{
   trace("Soy el botón " + param.num);
}

Creamos el objeto con los parámetros y lo incluimos dentro del constructor del botón. De esta manera las funciones asignadas al listener recuperarán el objeto con los parámetros internos de cada botón.

Código :

function clicBoton(e:MouseEvent,param:Object)

Haciéndolo de esta manera en cualquier momento podríamos tener acceso a los parámetros en el caso de crearnos unas funciones setter y getter para la propiedad, de manera que también podríamos acceder a ella desde la función del listener de esta manera:

Código :

trace("Soy el botón " + e.currentTarget.param.num);

 

Tweet