RSS : Articles / Comments


actionscript 2.0 para flash

jueves, marzo 04, 2010, Posted by Xabier Pérez, 2 Comments

ActionScript es el lenguaje de programación que ha utilizado Flash desde sus comienzos, y que por supuesto, emplea Flash. Entra en este post y descubre las principales características para poder empezar a trabajar con actionScript


A grandes rasgos, podemos decir que el ActionScript nos permitirá realizar con Flash todo lo que nos propongamos, ya que nos da el control absoluto de todo lo que rodea a una película Flash.

1/CARACTERÍSTICAS GENERALES: 

• El ActionScript es el lenguaje de programación propio de Flash, tal y como el Lingo lo es de Macromedia Director, por ejemplo. El ActionScript está basado en la especificación ECMA-262, al igual que otros lenguajes como Javascript.

• El 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 aplicación de fragmentos de código ActionScript a los objetos existentes en nuestras películas nos permiten alcanzar nuestros objetivos.

• El ActionScript es un lenguaje de programación 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 un lenguaje puramente orientado a objetos derivado del C o del Pascal como los anteriores, cada versión se acerca más a un lenguaje de este tipo. Así, la versión 2.0 es mucho más potente y mucho más "orientada a objetos" que su anterior versión 1.0.

• El ActionScript presenta muchísimos parecidos con el Javascript; si conoce Javascript, la sintaxis y el estilo de ActionScript le resultarán muy familiares.

• En la mayor parte de las ocasiones, no será necesario "programar" realmente, Flash pone a nuestra disposición una impresionante colección de "funciones" (de momento entenderemos "funciones" como "código ActionScript que realiza una función determinada") ya implementadas que realizan lo que buscamos, bastará con colocarlas en el lugar adecuado.

2/LOS OPERADORES: 

Entrando un poco más a fondo en la sintaxis y el manejo del ActionScript, vamos a comenzar hablando de los operadores, por ser la parte más elemental de una acción de ActionScript (y de muchísimos otros lenguajes de programación). Un operador es un tipo de carácter que realiza una acción especial dentro de una expresión de ActionScript. Una expresión no es más que un conjunto de operadores, variables y constantes relacionados entre sí de un cierto modo. Flash sacará un resultado de toda expresión que encuentre en nuestra película. Por ejemplo:

x = 3 ; -->; Es una expresión cuyo resultado será asignarle a la variable ' x ' el valor 3 (que es una constante)
y = 5 + x ; -->; Es una expresión cuyo resultado será asignarle a la variable ' y ' la suma de la constante 5 y la variable ' x ' que sabemos que vale 3 (porque le hemos asignado este valor antes). Por tanto, el resultado de esta expresión es asignarle a ' y ' el valor 8 (3 + 5).

Flash nos permite usar multitud de operadores, vamos a comentar los más comunes. Se puede acceder a los demás (y a estos) desde el Panel Acciones en la carpeta Operadores. Vamos a clasificar los operadores tal y cómo lo hace Flash.

• Operadores Aritméticos:
+ : Suma. Este operador sirve, como es de esperar, para sumar 2 valores.
- : Resta. Realiza la operación esperada de restar 2 valores.
* : Multiplicación. Realiza el producto de 2 valores
/ : División. Es la clásica operación de dividir. Al contrario que en algunos lenguajes de programación, este operador sí que realiza la división completa (incluyendo decimales)
% : Operador Resto. Este operador, no muy conocido en matemática, es un clásico de la programación. Devuelve el resto entre 2 números. Ejemplo: 4 % 3 = 1, 4 % 2 = 0.

• Operadores de Asignación:
= : Igual. Este es el operador más importante de esta categoría y sin duda, uno de los más usados. Almacena el valor situado en la parte derecha de una expresión en la variable situada en la parte izquierda. Ej: x = 2 + 3. Almacena en la variable x el valor de (2 + 3).

El resto de operadores de esta categoría son en realidad formas de realizar varias operaciones de una vez, describiremos uno a modo de ejemplo, el resto funcionan exactamente igual.

+= : MásIgual. Este operador asigna a la expresión situada a la izquierda del operador el valor resultante de sumar la expresión situada a la parte derecha con la expresión de la parte izquierda. Ejemplo: (Suponemos que x = 4 e y = 3) entonces, la expresión x += y provocaría que x pasase a valer el resultado de sumar ( 3 + 4 ). Por tanto, la expresión x += y es equivalente a hacer: x = x + y.

• Operadores de Comparación:
== : Probar Igualdad. Este operador sirve para comprobar si 2 expresiones son iguales. Si lo son, el valor de la expresión de comparación es 'true', que significa 'verdadero'. Por motivos semánticos, decir que una expresión es true es equivalente a decir que vale 1. Si no son iguales, devuelve 'false' (falso) o el valor 0.
Esta posibilidad de comprobar si una expresión es igual a otra, nos será muy útil para comprobar muchas cosas durante nuestra película y en función de ellas, hacer unas cosas u otras.
Pondremos un ejemplo, imaginemos que le pedimos a un usuario que introduzca su edad en un campo de texto de nuestra película flash. A ese campo le llamamos "edad_usuario". Le hacemos pulsar un botón "Continuar" y en ese momento comprobamos su edad, si tiene 20 años, le decimos una cosa, de lo contrario, le decimos otra distinta. Bastaría con hacer algo así:

if ( edad_usuario == 20 ) {
dar_mensaje_1; }
else { dar_mensaje_2; }

Aquí lo que estamos diciendo es lo siguiente: "Si edad_usuario es igual a 20, entonces damos el mensaje 1, sino lo es, damos el mensaje 2. También faltaría, lógicamente, crear las funciones "dar_mensaje_1" y "dar_mensaje_2".

>; : Mayor que. Devuelve como resultado verdadero (1) si la expresión de la izquierda es mayor que la de la derecha. De lo contrario, devuelve false (0).
<; : Menor que. Devuelve como resultado verdadero (1) si la expresión de la izquierda es menor que la de la derecha. De lo contrario, devuelve false (0).
>;= : Mayor o igual que. Devuelve como resultado verdadero (1) si la expresión de la izquierda es mayor o igual que la de la derecha. De lo contrario, devuelve false (0).
<;= : Menor o igual que. Devuelve como resultado verdadero (1) si la expresión de la izquierda es menor o igual que la de la derecha. De lo contrario, devuelve false (0).
!= : Probar Desigualdad. Devuelve como resultado verdadero (1) si la expresión de la izquierda es diferente a la de la derecha. De lo contrario, devuelve false (0). Ejemplo: 3 != 4 provocaría que la expresión total valdría 1 (true o verdadero). Pues 3 es, efectivamente, distinto de 4.

• Otros Operadores:
( ) : Paréntesis. Sirven, como es de esperar, para agrupar términos y dar preferencias en las operaciones (al igual que en las matemáticas). También se usa, como ya vimos, para pasar parámetros a funciones o acciones. (Éstos deben ir entre paréntesis)
" " : Comillas. En ActionScript, todo lo que va entre comillas, pasa a considerarse una cadena de caracteres, por lo que las funciones y acciones que afectan exclusivamente a las cadenas de caracteres pasan a afectar también al elemento entre comillas. Así por ejemplo, mientras que x representa una variable con un valor determinado, si escribimos "x", estamos escribiendo en realidad el carácter o la letra "x". Por tanto, podremos añadirlo a una palabra, compararlo con otras letras, escribirlo por pantalla etc.. pero ya no será una variable.

3/LAS ACCIONES:

Las Acciones son funciones predefinidas de ActionScript, es decir: Flash las crea, y nosotros sólo tenemos que usarlas de la manera que se nos indica. No tenemos que definir las funciones ni nada por el estilo, ni siquiera necesitamos saber cómo están hechas... Lo importante es que están listas para usar, lo que facilita el uso de este lenguaje de programación y sobre todo, haga muy rápido comenzar a programar. Definiremos las acciones escribiendo su cabecera (nombre + parámetros con un nombre genérico) para después explicar qué es cada parámetro.
• Acciones - Control de Película: Estas acciones se emplean, como su nombre indica, para controlar el flujo de nuestra película, esto es, para indicar a Flash en todo momento qué fotograma tiene que mostrar, cuándo tiene que parar, dónde seguir etc...
  • gotoAndPlay / goto: Esta acción será, probablemente la que más se usen durante la realización de las películas. La acción que realiza consiste en mover la cabeza lectora al fotograma que le indiquemos. La cabeza lectora es lo que determina qué fotograma de nuestra película se está reproduciendo en cada momento. Si, por ejemplo, lo movemos del fotograma 1 al 25, lo que veremos instantáneamente será el fotograma 25 y la película continuará reproduciéndose a partir de ahí. 
gotoAndPlay(escena, fotograma):
escena: Nombre de la escena a la que queremos enviar la cabeza lectora. Debe ir entre comillas dobles. fotograma: Número o nombre del fotograma al que queremos enviar la cabeza lectora. Si es un nombre, debe ir entre comillas dobles, si es un número, NO.
Ejemplo: gotoAndPlay("Escena2", 7); -->; Esta acción lleva la cabeza lectora al fotograma 7 de la escena llamada "Escena2".
  • Play: Da comienzo a la reproducción de la película, generalmente porque algo la ha detenido.
Play();No tiene Parámetros.

  • Stop: Detiene la reproducción de la película. Se puede usar en un fotograma, cuando queramos detenernos en él (porque es un menú, por ejemplo), en un botón, (para que detenga la película) etc...
Stop();
No tiene Parámetros.

• Acciones - Navegador / Red: estas acciones tiene diversas funciones, describimos las más importantes:
  • fscommand: Esta acción, es capaz de ejecutar ciertos comandos muy potentes. Lo más cómodo es pasar a Modo Básico (sino estábamos ya) e insertarla, nos aparecerá una pestaña con los posibles comandos que admite:
             - fullscreen: Si se activa pone nuestra película a pantalla completa. Muy útil para presentaciones en   CD-Rom, por ejemplo.             - allowscale: Controla el redimensionamiento de los objetos insertados en la película cuando el usuario estira los bordes de la misma (o de la página web en la que se encuentre) ¿Queremos mantener las proporciones? Este comando nos permite controlarlo.
             - showmenú: Si has visto el menú que aparece al pulsar el botón derecho del ratón sobre una película Flash, seguro que has pensado en hacerlo desaparecer ... puede que no interese que los usuarios puedan moverse a sus anchas por nuestra película. Ejecutando esta sentencia del modo adecuado (false), podremos ocultarlo.
            - trepallkeys: Sirve para detectar las pulsaciones de todas las teclas durante la reproducción de nuestras películas.

fscommand("comando","true / false")
comando: El comando a ejecutar (fullscreen, allowscale, etc...)
true / false: Aquí debemos escribir true o false, según queramos desactivar la opción o activarla.
Ejemplo: fscommand("fullscreen", "true"); ->; Activa la pantalla completa.

  • getURL: Esta acción se emplea para abrir el navegador web y abrir la página web que deseemos.
getURL(url , ventana , "variables")
url: Dirección web a la que queremos acceder (se abrirá una ventana).
ventana: Parámetro OPCIONAL. Modo en el que queremos abrir la ventana (en la ventana actual (_self) en otra nueva (_blank) etc...)
variables: Parámetro OPCIONAL, puede haber varios. Si la página lo permite (es ASP, PHP etc...) podemos enviarle variables.
Ejemplo: getURL("http://www.aulaclic.com", "_blank");

  • loadMovie / loadMovieNum: Esta acción permite cargar nuevas películas Flash o imágenes en nuestra película de forma dinámica (la película se cargará cuando se lo indiquemos, y no antes).
loadMovieNum(url , nivel / destino, variables)
url: Dirección absoluta donde está situada la película SWF o la imagen JPEG
nivel / destino: Nivel donde cargaremos la película, teniendo en cuenta que el nivel básico es el 0, luego va el 1 y así sucesivamente. Cada nivel superior se sitúa delante del anterior y toma el control. Si lo usamos como destino, aquí deberemos introducir el nombre del movieclip donde cargaremos la película o el nombre del marco si estamos cargando un fichero SWF en una página HTML con marcos.
variables: Parámetro OPCIONAL. Podemos enviar variables.
Ejemplo: loadMovieNum("MiPeli2.swf", 0) -->; Cargamos la película "MiPeli2.swf" en el nivel principal. No enviamos variables.

• Acciones – Condiciones: Estas acciones sirven para controlar la lógica de la película. Se puede decir que nos permiten "hablar" con Flash para indicarle lo que debe hacer ante distintas situaciones. Por ejemplo, ahora que conocemos muchas Acciones, ¿Cómo indicarle a Flash que "si la variable x = 3, entonces vaya al fotograma 5, y sino, vaya al fotograma 10"? . Sabemos comparar, sabemos ir a los fotogramas, pero no sabemos decirle a Flash "Si pasa esto, haz una cosa, y sino, haz la otra...".

if ... else: Si partimos de que la traducción literal de if es "si..." y la de else es "sino ...", nos encontramos de repente con todas las herramientas para decirle a Flash: "si (pasa una condicion) {haz esto} sino {haz lo otro}"
if (condición) {sentencias1 ... } else {sentencias2 ... }
if: Indica que acción que viene a continuación es una condicional
condicion: Indica una condicion que DEBE cumplirse para que sucedan las acciones indicadas en "sentencias1". Si éstas no se cumplen, entonces lo que sucede es lo especificado en las acciones indicadas en "sentencias2".
Para que una condición se cumpla, debe tener como resultado true, o lo que es lo mismo, verdadero, o lo que es lo mismo, 1. De ahí la importancia de los operadores de comparación y el valor que devuelven.
sentencias1: Conjunto de acciones que sucederán si la condición se evalúa como verdadera. Si hay más de 1, deben incluirse todas ENTRE LLAVES
else: Especifica la alternativa si condicion se evalúa a falso. Es OPTATIVO. Sino existe, y no se cumple la condición, no se hará nada, pues no lo hemos especificado.
sentencias2: Conjunto de acciones que sucederán si la condición se evalúa como falsa. Si hay más de 1, deben incluirse todas ENTRE LLAVES

Ejemplos:
if (x == 2) {gotoAndPlay(6); } -->; Si la variable x vale 2, entonces saltamos al fotograma 6, sino, no hacemos nada
if (y >; 7) { Stop(); } else {gotoAndPlay(1); } -->; si la variable y es mayor que 7, paramos la película,sino,volvemos al fotograma 1.

4/LOS OBJETOS: 

Los Objetos son instancias de una determinada clase. Esto es, son representantes de una clase ya definida. Así, son objetos, por ejemplo, un botón, un clip de película, un gráfico o un sonido ... es decir, que prácticamente TODO es un OBJETO en Flash.
Vamos a ver los objetos más usados en Flash y una breve descripción de cada uno de ellos. Cada objeto tiene una serie de Propiedades y unos Métodos y eventos, que dan funcionalidad a los objetos. Cuando un componente de Flash pasa a ser un objeto, automáticamente pasa a tener todas las propiedades definidas por Flash para ese objeto y pasa a reaccionar ante los Métodos y eventos que tiene definidos. Se puede encontrar una lista con todas las propiedades, métodos y eventos de los objetos en el Panel Acciones.

• Objeto "Button" (Botón)
Los objetos de tipo Botón tienen 4 estados, como ya se ha visto en el capítulo correspondiente y reaccionan ante métodos especiales como "OnRollOver", "OnPress" ... que permitirán que sucedan cosas cuando el usuario haga clic sobre estos botones, pase el ratón por encima etc... Cuando nos interese que una imagen que hayamos diseñado se comporte como un botón, bastará convertirla a botón y ya podremos usar los eventos típicos de un botón.
• Objeto "MovieClip" (Clip de Película)
Cuando necesitemos crear una película Flash dentro de otra película, pero no queramos tener 2 ficheros separados ni molestarnos en cargar una película u otra, deberemos crear un objeto movieclip. Entre sus propiedades especiales destaca que los objetos "clip de película" tienen, internamente, una línea de tiempos que corre independientemente de la línea de tiempos de la película principal de Flash, lo que nos permite crear animaciones tan complejas e independientes como queramos (podemos crear tantos clips de película dentro de otros como queramos).
• Objeto "Sound" (Sonido)
Los objetos sonidos no son visuales, y por tanto, no podremos ver como quedan en los fotogramas, al igual que haríamos con un botón o un clip de película. Deberemos controlarlos, por tanto, desde el Panel Acciones y usando ActionScript. Tienen multitud de métodos especiales, muy potentes y útiles, podemos parar un sonido, crear un bucle, darle efectos sonoros etc... Podríamos, por ejemplo, crear un objeto de tipo sonido y después hacer que al pulsar un botón suene.
• Objeto "Mouse" (Ratón)
El objeto mouse es uno de los objetos de Flash que ya está definido por Flash, pues hace referencia al ratón de Windows (al que manejará el usuario que vea nuestra película). Si lo usamos, podremos acceder a las propiedades del ratón de Windows, tipo de cursos, efectos asociados, detección de su posición etc...
Vale la pena insistir en que su manejo NO es análogo al de otros objetos como el botón, pues podemos crear tantos botones como queramos y hacer con ellos lo que decidamos, pero el objeto Mouse es único y actúa sobre el ratón del PC del usuario que vea nuestra película. Se puede decir que es un objeto "externo" que permite que otras partes del Sistema Operativo interactúen con nuestra película Flash. Por tanto, es muy potente.
• Objeto "Math" (Matemáticas)
Es uno de los múltiples objetos "abstractos" de Flash, ni es visual, ni parece que corresponda a nada existente en el sistema (como el objeto "Mouse"). Su función es muy importante, pues nos permite usar fórmulas matémáticas de modo muy sencillo.
• Objeto "String" (Cadena)
Es otro objeto peculiar, pues corresponde a un tipo de datos. Los strings o cadenas son secuencias de caracteres. Si definimos una secuencia de caracteres como objeto de tipo String, podremos usar los métodos que Flash implementa sobre ellas: Seleccionar subcadenas de letras, buscar una determinada letra en una palabra, convertir la palabra a letras mayúsculas y un largo etc...

5/LAS PROPIEDADES: 

Los Métodos suelen ser específicos de cada objeto, pero hay bastantes propiedades de los objetos que son comunes a muchos de ellos. Para usar las propiedades, se debe colocar el nombre del objeto seguido de un punto ( . ) y después la propiedad y su valor. Las propiedades siempre comienzan con un guión abajo ( _ ). Algunas propiedades se pueden escribir sin el nombre del objeto al que hacen referencia delante, en ese caso, harán referencia a la película principal. Vamos a ver cuáles son las más usadas y qué representan:

_alpha: Hace referencia a la opacidad del objeto al que afecte. La opacidad se puede definir como la no-transparencia. De modo que un 100% de transparencia equivale a un 0 de opacidad, o a un 0 de alpha.
_framesloaded: Son los fotogramas de un clip de película o de la película principal que el sistema lleva cargados en memoria. (Si se usa sin nombre de objeto delante obtenemos los fotogramas cargados de la película principal). Muy útil para crear cargadores o "preloaders"
_totalframes: Devuelve la cantidad de fotogramas que contiene el clip de película al que hace referencia. Si se emplea sin ningún nombre delante, nos devuelve la cantidad de fotogramas de la película Flash actual. También usado en la creación de cargadores.
_height: Devuelve la altura del objeto en píxeles. Por ejemplo, si tenemos un clip de película llamado "Clip1" y escribimos "Clip1._height" obtendremos la altura de Clip1. Del mismo modo, podemos cambiarla sin más que hacer: Clip1._height = 100; (la altura del Clip1 pasaría a ser de 100 píxeles)
_width: Propiedad idéntica a la anterior, pero devuelve la anchura.
_visible: Determina si el objeto está o no visible en nuestra película. Cuando vale 1, lo está, cuando vale 0, pasa a ser invisible. Es muy útil para hacer desaparecer partes de una película en un momento determinado. Por ejemplo, si queremos que al pulsar un botón desaparezca el clip de película llamado "Clip2", haremos esto: .... ... Clip2._visible = 0; ... ....
_x: Con esta propiedad obtenemos las coordenadas del objeto respecto del eje de las X. Sirve para averiguar la posición o para asignarla de forma dinámica (durante la ejecución de nuestra película Flash)
_y: Con esta propiedad obtenemos las coordenadas del objeto respecto del eje de las X. Sirve para averiguar la posición o para asignarla de forma dinámica (durante la ejecución de nuestra película Flash).
(post basado en el Curso Flash Cs3 de AulaClic)

2 Comments

Genesis Alvarado @ septiembre 24, 2010

Gracias de verdad por haberte tomado el tiempo para este excelente indice, muy explicativo y sencillo, me sirvio muchisimo

Anónimo @ agosto 14, 2012

fscommand("fullscreen", "true");
no funka, no me anda loko la concha de tu hermana escribi bien el codigo lrptm