Como programar botones en ActionScript 3.0

Actualización: Hemos realizado un video-tutorial sobre éste tema el cual está mucho mejor explicado. Lo puedes ver en éste link: http://xper.co/n2PeSl

Antes de iniciar: si eres un experto programador de ActionScript 3.0 no quiero decepcionarte, este es un tutorial extremadamente básico así que léelo bajo tu riesgo…

Ya habíamos hablado de la conveniencia de aprender ActionScript para agregar interactividad a las presentaciones hechas en Flash por lo cual estás dispuesto a repasar con el Flash que te conseguiste (no quiero saber como) lo que viste en la universidad o en el curso del año pasado y empiezas con lo más sencillo: crear un botón.

1. Creas una figura y la conviertes a botón (vamos avanzado)
2. Abres el panel Actions y Upssss, te encuentras con este texto: “Current selection cannot have actions applied to it” o sea: Sorry men, es hora de aprender ActionScript 3.0, bienvenido al futuro!

Como habíamos explicado en un post anterior, Flash CS3 incorporó el soporte para AS3 aunque sigue ofreciendo la oportunidad de trabajar en AS2 aún en la versión CS4. Veamos la diferencia en las dos versiones creando un botón que muestre un mensaje al presionarlo:

Quieres seguir trabajando en AS2? La verdad no deberías pero estos son los pasos para la creación del botón:

1. Abre Adobe Flash y en la ventana de inicio (Start Page) o en la ventana resultante del comando File/new… seleccionas “Flash File (ActionScript 2.0)”
2. Creas una figura y la conviertes en botón.
3. Seleccionas el botón y en el panel Actions escribes:
   on (release) {
   trace(”Usted presiono un boton”);}
   
4. Presiona Control/Comando + <Enter> para crear el .swf y al hacer click en el botón verás el mensaje “Usted presiono un boton” en el panel output.

Quieres empezar a trabajar en AS3? Esa es la actitud! entonces estos son los pasos para la creación del mismo botón:

1. Abre Adobe Flash (CS3 o posterior) y en la ventana de inicio (Start Page) o en la ventana resultante del comando File/new… seleccionas “Flash File (ActionScript 3.0)”
2. Creas una figura y la conviertes en botón.
3. Al seleccionar el botón y abrir el panel Actions verás el mensaje “Current selection cannot have actions applied to it”. Esto se debe a que AS3.0 no permite “pegar” acciones a objetos por lo cual debemos manejarlas desde la línea de tiempo, así que la primera tarea diferente que realizaremos será seleccionar el botón y darle como nombre de instancia “boton” en el panel de propiedades.
4. Creamos una nueva capa y haciendo click en el primer (y único) frame de esta capa abrimos el panel Actions y escribimos:
   

   Source code

   boton.addEventListener(MouseEvent.MOUSE_UP, mensaje);
   function mensaje(evento:MouseEvent):void
   {
   trace("Usted presiono un boton")
   }

5. Presiona Control/Comando + <Enter> para crear el .swf y al hacer click en el botón verás el mensaje “Usted presiono un boton” en el panel output.

Qué fué lo que escribimos en AS3? Primera línea: “pegado” al botón se crea un Listener que nos avisará cuando el usuario haga click (MOUSE_UP), cuando esto pase llamará la función “mensaje”. Segunda línea: Se declara la función “mensaje” que recibe como parámetro el evento de tipo MouseEvent y finalmente en la línea 3: mostramos el texto “Usted presiono un boton”.

¿Dudas y preguntas? Visita nuestros foros Xpert y mira a documentación listada en este post.

Necesitas capacitación o cursos de Flash CS4 o ActionScript? Mira la oferta de entrenamiento certificado Adobe.