Introduccin a la Programacin con ActionScript

(Extraido de aulaclic.com)
Si bien el objetivo de este tema NO es ensear programacin, no podemos pasar por alto que ciertos conceptos relacionados con ella deben conocerse para poder llegar a entender el ActionScript. Vamos pues a explicar algunos conceptos fundamentales, necesarios para abordar la programacin mediante ActionScript. Script: Cdigo escrito en cualquier lenguaje de programacin que realiza una tarea determinada. As por ejemplo, el cdigo ActionScript necesario para que al pulsar un botn de Flash pasemos al fotograma siguiente es un script. Variable: Vamos a explicar la interpretacin del trmino variable en programacin mediante un ejemplo sencillo. Si tenemos la expresin:
x = 3;

Tenemos que x es una variable que toma el valor 3. Se llama variable precisamente porque puede cambiar de valor en cualquier momento durante la ejecucin de nuestra pelcula Flash. Todos los datos que se manejan normalmente son variables (salvo aquellos constantes, por ejemplo el nmero 3). As, en un formulario de introduccin de datos personales, el nombre es una variable (de tipo cadena de caracteres o string), el apellido tambin, la direccin, el telfono etc... La primera vez que utilicemos una variable en nuestro cdigo, tenemos que definirla con la palabra reservada var, seguida del nombre que le queramos asignar, dos puntos y el tipo de datos que contendr. Y si queremos, tambin, podemos asignarle un valor inicial. Es decir, utilizaremos el siguiente formato:
var nombreVariable:TipoDato = valorInicial;

El tipo de dato puede ser cualquier objeto, por ejemplo un MovieClip. Habitualmente utilizaremos el tipo String para cadenas de texto y el tipo Number para nmeros. Expresin: Conjunto de operadores, constantes, variables o acciones que permiten obtener un valor. Sentencia o instruccin: Provocan un resultado o una accin determinada y concreta. Por ejemplo, una asignacin, la llamada a una funcin, etc. Deben ir terminados por ' ; ' (punto y coma). Funcin: Una funcin es una porcin de cdigo (ActionScript en nuestro caso) que tiene un nombre determinado y que realiza una labor concreta generalmente devolviendo un determinado valor. Ejemplo, la siguiente definicin de funcin:

? 1function Incrementa(x) { return x + 1; 2 3 } Realiza la funcin de tomar la variable "x" y devuelve su valor sumndole uno. Si quisiramos ejecutarla en algn lugar de nuestra pelcula, bastara con escribir: valor=Incrementa(3), siempre y cuando la definicin de la funcin (que es el cdigo mostrado arriba) est en cualquier parte de la pelcula. Esto provocara que la funcin calculase el valor 4 (3 + 1) y lo guardase en la variable valor. Accin: Flash llama Accin a funciones que l mismo ha implementado y que no requieren ser definidas para ser usadas. Basta por tanto, con escribir el nombre de la accin. Estas acciones son lo que usaremos la mayora de las veces, pues resultan sumamente fciles de usar y muy potentes. Las acciones aparecen en el Panel Acciones y se pueden insertar en nuestro cdigo con un simple clic de ratn. Por ejemplo gotoAndPlay(3); es una accin. Ahora que entendemos qu son las funciones, deberemos comprender tambin, que en alguna parte, Flash ha definido la funcin gotoAndPlay (tal y como hemos hecho nosotros anteriormente con la funcin Incrementa) y ha escrito un cdigo que provoca el efecto ya comentado. Por suerte todo esto no nos debe preocupar, Flash CS5 se encarga de todo. Nos basta con conocer cmo usarlas. Parmetro o argumento: Un parmetro es una variable que entra o sale de una accin o funcin. Ponemos un ejemplo: Tenemos la siguiente definicin de funcin: ? 1function areaRectangulo(lado1, lado2) { return lado1*lado2; 2 } 3 Imaginemos que queremos calcular el rea de un rectngulo con un lado1 = 2 y un lado2 = 3, y guardarlo en la variable area. Ejecutaramos la funcin areaRectangulo del siguiente modo: area = areaRectangulo(2, 3);. Vamos a ver qu hace exactamente la funcin con los parmetros lado1 y lado2. Al ejecutar areaRectangulo(2, 3), Flash busca definiciones de funciones que se llamen areaRectangulo, enseguida encontrar la definicin que hemos escrito arriba, (que deber estar escrita en alguna parte de nuestra pelcula, en el mismo fotograma o en alguno anterior al que utilizamos). Cuando lo hace, comprueba que la funcin que ejecutamos COINCIDE con la cabecera de la definicin, esta cabecera abarca el nombre de la funcin y

todo lo que venga a continuacin hasta que se cierre el parntesis. En nuestro caso, la cabecera sera areaRectangulo(lado1, lado2). Aqu viene la pregunta inminente, Coinciden?. La respuesta es S, para que coincidan DEBE coincidir el NOMBRE de la funcin y el nmero de parmetros, que sern variables o valores separados por comas. Como tenemos 2 parmetros en cada parte, todo coincide y pasa a ejecutarse la funcin. La funcin ejecutada es areaRectangulo(2, 3), por lo que lo que en realidad se ejecutar:? 1function areaRectangulo(2, 3) { return 2*3; 2 } 3 Tras ejecutarse esta funcin, se calcula el rea y se devuelve (return) su valor. Como le asignbamos el valor a una variable (area = areaRectangulo(2, 3);), el valor devuelto queda almacenado en esa variable.

Programacin Orientada a Objetos (POO): ActionScript 3 es un lenguaje orientado a objetos, esto quiere decir que la informacin se organiza en grupos denominados clases. Cuando queremos emplear una clase en nuestra pelcula, usamos una instancia de ella, denominada objetos. Los objetos, y por tanto, las clases, tienen Propiedades (caractersticas, que a nivel interno son variables) y Mtodos (comportamientos, que a nivel interno son funciones). El objeto Persona tiene: Propiedades:Nombre, edad, altura ... Comportamientos: hablar, correr, saltar ... El objeto Clip de Pelcula tiene: Propiedades: rotacin, anchura, altura ... Comportamientos: reproducir, ir a un fotograma, parar, ... Evidentemente el primer objeto es meramente didctico, el segundo objeto es un objeto de Flash (salvo que las propiedades estn definidas en ingls), y probablemente el ms importante...

Los objetos los podemos encontrar tambin en el Panel Acciones, su uso es sencillo. Veamos un ejemplo: Tenemos el objeto Clip1, que es una instancia de la Clase MovieClip y por tanto, tiene sus mismas Propiedades y Mtodos. Clip1.height = 20; Con la lnea anterior, estamos diciendo a Flash que el objeto Clip1 tiene una altura de 20 (inmediatamente Flash la modificar en el fotograma en el que se encuentre). La sintaxis de Flash establece que debe existir el separador ".", no vale la pena entrar a describir el porqu. Siempre ser as, no lo olvidemos. Clip1.play(); Esta accin ejecutar el mtodo play, que pertenece a los Clips de Pelcula, provocar que se comience a ejecutar la lnea de tiempos del Clip1. Ntese que termina con (), ya que play es una funcin y todas las funciones deben llevar parntesis aunque no tengan parmetros..

Eventos. Con lo que hemos visto, ya podemos realizar algunos cambios o ejecutar instrucciones en nuestras pelculas. Pero cundo? Flash suele interactuar mucho con el usuario, y est esperando que l haga algo (hacer clic, parar el ratn por encima, pulsar un botn) para ejecutar determinado cdigo. Este es el mecanismo de los eventos. Al utilizar los eventos, le decimos a nuestros objetos que estn a la escucha, para que cuando detecten determinada accin, ejecuten la funcin que le indiquemos. Por ejemplo, con el siguiente cdigo... ?

miBoton.addEventListener(MouseEvent.MOUSE_CLICK, 1 funcionAlHacerClick); 2 function funcionAlHacerClick(event:MouseEvent):void 3 { 4 this.gotoAndPlay(15); 5 } Le estamos diciendo al objeto miBoton que est a la escucha (.addEventListener), atento para detectar el evento MOUSE_CLICK, que se produce al hacer clic sobre l. Y le indicamos que cuando lo detecte, ejecute la funcin que hemos llamado funcionAlHacerClick, en la que hemos escrito las acciones que queremos que realice. Los eventos son fundamentales en la programacin con Action Script, y los iremos viendo en el curso.

Ya conocemos los conceptos bsicos de Flash CS5. Si pensamos en que, con slo 1 lnea podemos modificar la altura de un objeto de nuestra pelcula durante la ejecucin de la misma (y no mientras la crebamos como hasta ahora), podremos hacernos una idea de lo que nos permitir el ActionScript ... Podremos dar vida a nuestras animaciones y conseguir una interactividad total con el usuario. Podremos conseguir una pelcula completamente multimedia e interactiva.

El conocimiento y comprensin de estos conceptos no es un requisito obligado para comenzar a programar con ActionScript, programar por "copia y pega" es una prctica muy comn en este tipo de lenguajes. En este curso recomendamos saber lo que se est haciendo en todo momento y conocer bien qu es cada cosa, y pensamos que hacer un esfuerzo inicial nos gratificar constantemente durante nuestro aprendizaje de ActionScript,

pues con todo lo anterior claro y un poco de trabajo, pronto pasaremos a ser programadores expertos. 16.1. Qu es el ActionScript? El ActionScript es el lenguaje de programacin que ha utilizado Flash desde sus comienzos, y que por supuesto, emplea Flash CS5. A grandes rasgos, podemos decir que el ActionScript nos permitir realizar con Flash CS5 todo lo que nos propongamos, ya que nos da el control absoluto de todo lo que rodea a una pelcula Flash. Absolutamente de todo. Sin embargo, en estos temas slo vamos a ver una pequea introduccin a ActionScript 3 que servir para sentar las bases que permitirn empezar a trabajar con ActionScript. Ensear a programar con ActionScript requerira otro curso completo. Profundizar en el conocimiento de este lenguaje queda por cuenta del lector. Recomendamos seguir la estupenda Ayuda incluida en Flash CS5. Todo lo referente a este curso hace referencia a la versin 3 de ActionScript. Si buscas informacin sobre ActionScript 2.0, te recomendamos el curso de Flash CS3, en el que resolvemos los mismos ejemplos, pero con AS 2.0.

Caractersticas generales Como ya hemos comentado, el ActionScript es el lenguaje de programacin propio de Flash, tal y como el Lingo lo es de Macromedia Director, por ejemplo. El ActionScript est basado en la especificacin ECMA-262, al igual que otros lenguajes como Javascript. ActionScript es, como su nombre indica, un lenguaje de script, esto quiere decir que no har falta crear un programa completo para conseguir resultados, normalmente la aplicacin de fragmentos de cdigo ActionScript a los objetos existentes en nuestras pelculas nos permiten alcanzar nuestros objetivos.

ActionScript 3 es un lenguaje de programacin orientado a objetos. Tiene similitudes, por tanto, con lenguajes tales como los usados en el Microsoft Visual Basic, en el Borland Delphi etc... y aunque, evidentemente, no tiene la potencia de estos lenguajes, cada versin se acerca ms. As, la versin 3.0 utilizada en Flash CS5 es mucho ms potente y mucho ms "orientada a objetos" que su anterior versin 2.0. La sintaxis ActionScript presenta muchsimos parecidos con el Javascript o PHP; si estamos familiarizados con estos lenguajes, la sintaxis y el estilo de ActionScript nos resultarn muy familiares. Las diferencias entre JavaScript y ActionScript las podemos encontrar en la ayuda que acompaa al Flash CS5. En la mayor parte de las ocasiones, ser necesario "programar". Flash CS5 pone a nuestra disposicin una biblioteca de funciones, clases y mtodos (de momento entenderemos esto como "cdigo ActionScript que realiza una funcin determinada") ya implementadas que realizan lo que buscamos, bastar con colocarlas en el lugar adecuado. 16.2. El panel Acciones

En Flash CS5, el Panel Acciones sirve para programar scripts con ActionScript, por tanto lo aqu introduzcamos le afectar de menor o mayor medida. Debemos tener claro desde un principio que el Panel Acciones puede hacer referencia a Fotogramas u objetos, de modo que el cdigo ActionScript introducido afectar tan slo a aquello a lo que referencia el Panel. Por ejemplo, en la imagen inferior, se puede distinguir que el Panel Acciones hace referencia al Fotograma 1 de la Capa 1 (en el nombre de la pestaa de la zona de la derecha y en la zona izquierda en el apartado Seleccin actual).

El Panel Acciones se divide en 2 partes, a la izquierda tenemos una ayuda facilitada por Flash que nos da acceso de un modo rpido y muy cmodo a todas las acciones, objetos, propiedades etc... que Flash tiene predefinidos. Estos elementos estn divididos en carpetas, que contienen a su vez ms carpetas clasificando de un modo eficaz todo lo que Flash pone a nuestra disposicin. Para insertarlos en nuestro script bastar con un doble clic sobre el elemento elegido. En la parte derecha tenemos el espacio para colocar nuestro script, el cdigo de ActionScript. El cdigo lo podemos insertar en cualquier fotograma clave, aunque lo ms "limpio" es crear una capa para el cdigo. El Panel Acciones de Flash CS5, no tiene nicamente un modo de edicin. Podemos utilizar el , en el que en vez de escribir directamente, seleccionamos los distintos elementos desde listas. Puede resultar til al principio, cuando an no estamos familiarizados, pero nos limita mucho al escribir. Cuando ya tenemos cierta soltura nos encontraremos ms cmodos con el Asistente de script desactivado, lo que nos permite escribir directamente el

cdigo. Este ltimo modo nos dar ms libertad y agilidad si sabemos qu hacer, pero tambin es ms fcil que cometamos errores. En la parte superior encontramos herramientas que nos ayudarn. Veamos las ms tiles: Buscar: Busca un texto en el cdigo. til, por ejemplo, si queremos buscar en todos los sitios que empleamos un objeto. Revisar sintaxis. Comprobar errores en la sintaxis, normalmente que hayamos olvidado cerrar parntesis o corchetes. Si encuentra alguno, nos mostrar un mensaje como el siguiente:

En el panel Errores de compilador se mostrarn los errores indicando la capa, fotograma y lnea. Podemos ir al lugar del error haciendo doble clic. Formato automtico. Al escribir en cualquier lenguaje, es muy importante hacerlo ordenadamente y con el formato adecuado. Este botn lo hace automticamente, siempre que no haya errores de sintaxis. Cuando tenemos mucho cdigo, nos resultar ms cmodo si contraemos ciertas partes. Con estos botones, podemos, de izquierda a derecha, contraer el espacio entre llaves, contraer la seleccin o expandir todo. Cuando estamos programando, es frecuente que queramos comentar un fragmento de cdigo para que no se ejecute o que queramos aadir comentarios descriptivos. Con estos botones, podemos comentar el texto seleccionado, o descomentarlo.

Aunque la sintaxis sea correcta, puede que al probar nuestra pelcula se sigan produciendo errores (errores de compilacin). Por ejemplo porque accedemos a una propiedad de un objeto que no existe, o nos hemos equivocado al escribir el nombre de una variable. Estos errores tambin nos aparecern en el panel Errores de compilador. En este caso, fjate en el nmero de lnea del error, ya que al hacer doble clic, a veces no va al lugar correcto si el cdigo tiene comentarios. Para entender mejor este concepto te recomendamos hacer el Ejercicio Panel Acciones.