mantcompu2014: Macromedia Flash 8 y action script

El siguiente contenido será la descripción inicial de action script en Macromedia flash 8, algunas cosas se tomaron de la página de aulaclick.com, con el objetivo de tener un respaldo de información mientras se sigue con el curso:

PANEL DE ACCIONES EN MACROMEDIA FLASH

“En Flash 8, el Panel Acciones sirve para programar scripts con ActionScript. Esto es, que todo lo que introzcamos en dicho Panel se verá reflejado después en nuestra película. Debemos tener claro desde un principio que el Panel Acciones puede hacer referencia a Fotogramas u objetos, de modo que el código ActionScript introducido afectará tan sólo 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.

El Panel Acciones se divide en 2 partes, a la izquierda tenemos una ayuda facilitada por Flash que nos da acceso de un modo rápido y muy cómodo a todas las acciones, objetos, propiedades etc... que Flash tiene predefinidos. Estos elementos están divididos en carpetas, que contienen a su vez más carpetas clasificando de un modo eficaz todo lo que Flash pone a nuestra disposición. Para insertarlos en nuestro script bastará con un doble clic sobre el elemento elegido.

Posteriormente veremos con detalle los distintos elementos de este Panel.”

“A la parte derecha tenemos el espacio para colocar nuestro script, aquí aparecerá lo que vayamos insertando. También incluye herramientas de utilidad, como la búsqueda de palabras, la posibilidad de insertar puntos de corte, la herramienta Revisar Sintaxis y la ayuda de Flash para ActionScript.

La libertad del modo "Experto" es total y por tanto, también lo es la posibilidad de cometer fallos, para asegurarnos de que nuestro script es correcto, al entrar en Modo Experto nos aparecerá un icono con el aspecto de Al pulsarlo Flash revisa nuestro código en busca de posibles errores, indicándonos, en su caso, la línea que presente el error y en qué consiste éste.

Es un fallo común pasarse horas buscando porqué nuestra película no funciona correctamente y que el motivo sea que un error de sintaxis ha invalidado todo el código existente en un fotograma, que actúa como si no hubiera NADA DE CÓDIGO en él. Pongamos pues, mucha atención en esto y revisemos el código concienzudamente.”

“El uso del modo en asistente es mucho más sencillo para ello pulsa el botón Asistente de Script y selecciona los comandos que quieras incluir, aparecerán las opciones que deberás rellenar para que estos comandos funcionen correctamente y el código se generará automáticamente. Esta es una muy buena utilidad recuperada que permitirá a los usuarios que acaban de empezar el uso de este lenguaje.

Aun así es recomendable siempre repasar el código y así irnos familiarizando con él y de este modo poder poco a poco crear nuestro propio código en modo Experto, lo que nos dará mayor flexibilidad a la hora de crear nuestras películas.”

TALLER EN CLASE

Para este taller en clase se deberá visualizar el siguiente video:

Video 2:

LOS OPERADORES EN ACTIONSCRIPT

Los operadores más utilizados en la programación de actionscript son las operaciones de aritméticas tales como: suma, restas multiplicación y división, estas operaciones se realizan escribiendo los operadores seguidos de las operaciones, estas se deben almacenar en una variable para que se puedan solucionar o llamar en una instancia mas adelante:

“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 8 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. El lector 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 8.

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ás Igual. 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.

El significado de 'if' y 'else' lo veremos más adelante, de modo que no nos preocupemos por no entender perfectamente el código escrito arriba. 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.”

TALLER EN CLASE

Ver el siguiente video:

LAS ACCIONES EN ACTION SCRIPT

Las Acciones son funciones predefinidas de ActionScript, es decir: Flash 8 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.

Al igual que en el caso anterior, explicaremos las Acciones más importantes. Para una referencia más completa, recomendamos mirar la ayuda del programa.

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... Veámoslas y lo entenderemos mejor:

gotoAndPlay / goto: Esta acción será, probablemente la que más useis durante la realización de vuestras 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í.

Uso:

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.

Uso:

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...

Uso:

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.

Todas estas alternativas, comparten modo de uso, veámoslo:

Uso:

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.

Uso:

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).

Uso:

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...". Veamos cómo decírselo:

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}"

Veamos antes que nada su Uso para comprenderlo mejor:

Uso:

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

Ejemplo:

if (x == 2) {gotoAndPlay(6); } --> Si la variable x vale 2, entonces saltamos al fotograma 2, 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.

TALLER EN CLASE, CREANDO UN JUEGO DE MIRA Y DISPAROS

para crear este juego de disparos, debemos escribir los siguientes códigos respectivamente en cada una de las capas

codigos:
----------mira------------------
onClipEvent(enterFrame){
Mouse.hide();//hides the mouse
this._x=_root._xmouse;//sets the x of the player to the x of the mouse
this._y=_root._ymouse;//sets the y of the player to the y of the mouse
}

-------enemigo----------
on (release){ gotoAndPlay(2)}

-----------fotogramas------------------
stop();

PASOS PARA LA CREACION DEL JUEGO_:

1. Crear al enemigo con animación para que sea bastante difícil dispararle
2. Crear al enemigo con animación una vez le han disparado.
3. Insertar una imagen como mira de tal forma que se vea mas realista

EJERCICIO No. 2 CREACION DE UN JUEGO LABERINTO

Para el siguiente taller se debe crear todas las capas respectivamente y los fotogramas para que sea consecutiva la ejecución. En los fondos se pueden colocar imágenes que representen los laberintos y así dar una mejor perspectiva.

El código de action script es el siguiente:

el boton jugar, el campo, el jugador (cursor), la meta, y el boton reintentar, todas con sus acciones:

Jugador:

onClipEvent(load){

startDrag("",true);

}

Boton Jugar: on(release){gotoAndStop(2);}

Muros: on(rollOver){gotoAndStop(3);}

Meta: on(rollOver){gotoAndStop(4);}

Reintentar: on(release){gotoAndStop(1);}

En el primer fotograma de la capa Laberintos:

stop();