domingo, 21 de marzo de 2010

Listeners en AS3

Una de las cosas más complicadas de entender cuando se hace la migración de lenguaje AS2 al AS3, es el manejo de los listeners, que tienen un nombre bien raro y en español son difíciles de interpretar, ya que la palabra escuchador es muy poco común, por eso escribo este tip, para aprender a utilizarlos e intentar solucionar ciertas inquietudes.


--

En mis clases siempre digo que antes de definir un concepto técnicamente se debe hacer coloquialmente, es decir, antes de definir un término muy complicado y llenarlo de palabras difíciles de entender, se debe definir de la manera más sencilla y orientada al idioma. En este caso hablaremos de los Listeners, sabemos que la palabra al español se traduce como “escuchador” u “oyente”, palabras muy poco utilizadas ya que no creo haber conocido a alguien que le paguen por eso, no es común escuchar la frase: “…si, y ese de allá es Pedro, el escuchador…”. Ahora, teniendo claro que un escuchador es aquel que está siempre atento a escuchar a los demás tenemos que definir los demás conceptos que están asociados a los listeners en AS3.

Recordemos que AS3 es un lenguaje de programación orientado a Objetos y a Eventos, un objeto es todo lo que podemos hacer en el lenguaje y puede tomar cualquier forma, ahora definamos evento. Un evento es un suceso que le puede pasar al objeto, de esta manera un objeto de la clase persona tiene eventos como, tener sed, tener hambre, tener ganas de ir al baño, tener sueño, todos esos son eventos, sucesos que le pasan al objeto, para poder controlar estos eventos se recurre al uso de métodos, que son las acciones propias del objeto, así pues, cada evento tiene asociado un método de esta manera:

tener sed beberLiquido()
tener hambre comer()
tener ganas de ir al baño irBaño()
tener sueño dormir()

Entendiendo esto, vamos a pasar a la práctica, todos los objetos dentro de AS3 bien sean de Flash o del SDK de Flex, tienen unos eventos que se pueden manejar. Por ejemplo en Flex, el objeto Application (que esta usualmente en la primera etiqueta del código mxml, tiene un evento applicationComplete, que indica que la aplicación está completa es decir que ha cargado todos sus controles, sabiendo esto, podemos hacer un método que se dispare cuando la aplicación se carga y que empiece a cargar datos de una fuente de datos.

Para no hacer tan complicado el ejemplo, voy a hacerlo con un botón, y vamos a añadir un escuchador de evento para varios de sus eventos, esto lo haré con Flash, pero en Flex también se puede hacer, lo primero que vamos a hacer, es crear una figura en flash, lo convertimos en un botón o en un movieClip, personalmente prefiero los movieclips, ponemos un nombre de instancia y vamos al código.

Mi botón en este caso se llama boton_btn. Ahora vamos a programar los métodos para cada uno de los eventos, de esta manera.

boton_btn.addEventListener(MouseEvent.CLICK, clic);
function clic(
e:MouseEvent):void{
trace(
"el boton fue presionado");
}


Así se programa el evento Click para el botón, de la misma manera podemos programar un evento del mouse o del teclado, del escenario y en general de cualquier objeto para que se ejecute acción, en el archivo adjunto se encuentra la programación para más eventos del Mouse para este botón.

Cómo conclusión podemos decir que un listener es un objeto que está siempre atento a escuchar a otro objeto y cuando escucha algo, dispara un método que ejecuta cierto proceso lógico, me viene a la mente Superman, el super heroe es un listener, Luisa es otro objeto, que dispara el evento caer, superman escucha que ella está cayendo y ejecuta el método correr, o volar y después el método recibir para salvar la vida de Luisa.


3 comentarios:

  1. Hola Juan,

    Me parece excelente la forma en que abordaste el tema de los listener algo que para mi habia sido confuso hasta la fecha, solo que ahora me surge una duda, es posible aplicarlos sobre la escena sin la necesidad de un boton "fisicamente" dibujado??? Por ejemplo dar click sobre cualquier lugar de la escena y que dibuje un circulo, cosas de ese estilo.

    Espero me puedas aclarar mi duda. Muchas gracias =)

    ResponderEliminar
  2. claro que si se puede añadir un listener a cualquier objeto dentro de la película o aplicación. si lo que quieres es dibujar una forma, lo que debes hacer es agregar un listener a un movieclip contenedor (tablero_mc) o al escenario por stage, prueba este código:

    import flash.events.MouseEvent;

    stage.addEventListener(MouseEvent.CLICK, trazo);
    function trazo(e:MouseEvent):void{
    graphics.beginFill(0x999999);
    graphics.lineTo(mouseX, mouseY);
    }

    Básicamente lo que hace este código es que dibuja líneas cada vez que presionas clic en alguna parte del escenario.

    ResponderEliminar
  3. Muchas gracias por aclarar mi duda, me sirvio mucho. =)

    ResponderEliminar