Flash as3 - Tutorial II - Propiedades y Programacion Basica en Weblogs de Yaaqui.com

Layer Actions y Panel de Código Fig 1

Para ingresar el código en esta layer, seleccione con el mouse el primer fotograma o keyframe, indicado en la Fig 1 en color negro y bajo el numero 1 de la linea de tiempo o timeline, y luego presione la tecla F9. El panel aparece como una ventana de tab adherible al escenario, y con una leyenda que dice Actions-Fotograma dependiendo del idioma.

Si necesita ingresar una nueva layer, presione el primer botón indicado en la Fig 2, y aparecerá una nueva capa sobre la capa existente, por costumbre, la layer actions, va sobre todas las layers, para fácil ubicación, asi que la layer se puede seleccionar y arrastrar con el mouse sobre la nueva layer.

Insertar Nueva Layer Fig 2

Para nuestro ejemplo haremos dos objetos, un Button o SimpleButton, y un MovieClip, agregaremos funcionalidad al Button, para que modifique al MovieClip. El Button será a base de un shape cuadrado azul y convertido con F8, y el MovieClip será a base de un shape cuadrado rojo y convertido con la tecla F8; el Button se llamará my_btn, y el MovieClip my_mc; estos sufijos son necesarios para cada instancia (_mc, _btn) para forzar al Flash a desplegar las propiedades inherentes a cada Class, si bien se pueden intercambiar, la idea es tener el que corresponde para obtener las propiedades correctas.

El nombre de cada objeto se coloca en el panel de propiedades (Fig 3), primero se selecciona el objeto y luego se presiona Ctrl-F3 si el panel no está visible, y el nombre que usaremos en el código se coloca en la caja de texto que dice en color gris claro.

Insertando nombre de instancia Fig 3

Colocados los nombres desplegamos el panel de código de actionscript, seleccionado el primer frame del layer actions y presionando F9, luego digitamos el siguiente código, de acuerdo a la versión que manejemos, as2, o as3:

Ambos códigos hacen lo mismo, pero desde puntos de vista a futuro, el código as3 es mas útil para un programador, pero el código as2, es más útil para un diseñador, ya que es más cercano a nuestro lenguaje.

Aquí, al boton le decimos que cuando el Event de Mouse Click se realice sobre él, se ejecute la function onClick.

Luego la function onClick tiene un parametro e de tipo MouseEvent, éste carga con un monton de propiedades necesarias que hacen referencia al objeto que realizó y sobre el que se realiza la accion, por ejemplo, currentTarget, es el boton al que hicimos click.

En la definición del Function llamamos directamente a my_mc, y variamos una de sus propiedades (rotation), la incrementamos cada vez en 25;


my_btn.addEventListener(MouseEvent.CLICK,onClik)

function onClik(e:MouseEvent){
var boton:SimpleButton = e.currentTarget as SimpleButton
trace(boton.name)
my_mc.rotation += 25;
}

Aqui es casi lo mismo, antes, en as2, para definirse al objeto que llama a la Function, usamos this, y el evento está dentro del mismo botón, así que asignamos una Function sin nombre y dentro ponemos lo que necesitamos que deba suceder.


my_btn.onPress = function(){
trace(this)
my_mc._rotation += 25;
}

Presione Control Enter y vea el resultado al presionar el botón.

Descargar Archivos del tutorial