MuelaLab Blog: Tutoriales Diseño Web, flash, Facebook, php, Actionscript.

Botones, Eventos, getURL en ActionScript3 (Flash)

Buenas denuevo, primer tutorial de ActionScript3 en muelalab.com y de aqui muchos mas asi que no dejen de preguntar!… Ahora veremos como crear un ya no tan simple boton con Flash y actionscript3, el antes y despues veremos el cambio que ha sufrido el codigo de AS2 a AS3.. Y aprenderemos a manejar lso eventos de boton mas usados.. Aqui esta el resultado del ejemplo que veremos ahora:

This movie requires Flash Player 8

Como vemos estamos viendo los eventos al precionar, soltar, pasar por encima o salir de encima… Creamos un nuevo ducumento de Flash ActionScript 3 (les pongo una imagen q seguro ni sabian que existia esa opcion =P!!!), Seleccionamos el primer fotograma y Creamos un campo de texto dinamico, le ponemos como nombre de instancia “campo” (Por suerte esto es igual para AS2 y AS3), Ahora creamos un boton dibujando un simple rectangulo lo seleccionamos y precionamos F8, seleccionamos de tipo “boton” y le ponemos un nobre cualquiera, luego lo volvemos a seleccionar ya en el escenario y en el panel de propiedades (Ctrl+F3) le ponemos como nombre de instancia “bt1_btn”… Por ahora tenemos lo mismo que si usaramos AS2 y con AS2 seleccionariamos el primer frame y usariamos el siguiente codigo para hacer una accion al precionar:

bt1_btn.onRelease=function(){
campo.text="Modificando el Texto";
}
Botones En ActionScrip 3:

Para su mala suerte!! si probaramos ahora tendriamos un error espantoso xD!.. Se acabo ese codigo tan simple y mal escrito (segun los expertos), en AS3 estamos programando orientado a objetos! (OOP)… deberemos crear objetos, y sus respectivos eventos!.. Manos a la obra!! haremos funcionar ese boton ahora mismo! (seleccionamos el primer frame de la pelicula, en AS3 ya no podemos poner acciones en los propios MC o botones…) copiamos este codigo en el panel de acciones (F9):

function alSoltar(evento:Event):void{
	campo.text="Me Soltaste!...";
}
  • Explicacion: Primero Creamos una funcion “alSoltar” esta funcion tiene 1 parametro de tipo “Event” (una variable que recibira informacion sobre quien llamo a la funcion, que evento se ejecuto y algunas otras cosas mas)… y esta misma funcion regresara “void” (nada), luego vemos que modifica el campo de texto “campo” con la propeidad “.text” que para nuestra suerte no cambia en AS3…

Ahora necesitaremos hacer que la funcion se ejecute al precionar el boton, pra esto usaremos “listener” (escuchador-perseguidor-vigilador de eventos)… para esto pegamos el siguiente codigo debajo del afuncion anterior:

bt1_btn.addEventListener(MouseEvent.CLICK,alSoltar);
  • Explicacion: Como ven indicamos que al boton “bt1_btn” se le añada un Listener, este listener esta pendiente de cuando se haga un Click (MouseEvent.Click) sobre el mismo, y cuando se hace el click llama a la funcion “alSoltar” del segundo parametro..

De esta forma logramos que se haga un llamdo a la funcion, como ven es mas complicado que antes, pero al usar los eventos se nos permitira tener un mejor manejo de acceso de variables al programar en OOP… Ahora ahi mas eventos que usan de igual forma que el MouseEvent.Click como son:

  • MouseEvent.MOUSE_DOWN: Al Mantener precionado el raton (onPress AS2)
  • MouseEvent.MOUSE_MOVE: Al mover sobre el boton (onRollOver AS2)
  • MouseEvent.MOUSE_OUT: Al Salir fuera del boton (onRollOut AS2)

Se usan añadiendo varios listeners, uno para cada evento y cambiando la funcion que queramos que se ejecute!!!…Listo!..

Ahora ya que empesamos a dominar un poquito los botones veremos como seria una funcion para llamar a una URL en AS3, para esto vamos a crear primero la funcion y ya ustedes se la asignan para que se ejecute en algun evento, antes usabamos getURL AS2, ahora no la cambiaron un poquito, el codigo seria el siguiente:

function muelalab(e:Event):void{
navigateToURL(new URLRequest("http://www.muelalab.com"));
}

Explicacion: Se crea la funcion con su nombre “muelalab” y parametro de tipo “Event”,  luego se usa la funcion “navigateToURL” y a esta funcion tenemos que hacerle un pedido para llamar a una URL, lo hacemos escribiendo “new URLRequest” y dentro de esta funcion colocamos el link…

Listo!… y por que asi tan dificil?? bueno ahora usamos este  metodo que luego veremos mas ampliamente, pero en si la novedad es que podremos enviar un url con datos para formularios GET o POST, o cualquier otro tipo de informacion…

Bueno esso seria todo, espero les sea de ayuda!.. y cualquier duda/sugerencia/comentario estoy para escucharlos!… Estaremos colocando tutoriales muy seguido asi q sigan visitandonos, y recomiendenos con sus amigos xD!.. Gracias y suerte!!!…
Descarga De Archivos Muelalab.com

  • de tan sencillo : MAGNÍFICO!!!

  • muy bueno y facil de entender!!

Puedes Seguir Cada Respuesta A Esta Entrada Desde El Archivo RSS 2.0