I.E.D VENECIAJENNIFER ALEJANDRA RUIZ VEGA

CURSO:1101

ActionScript 

CARLOS HERRERA

QUE ES ACTIONSCRIPT Es el lenguaje de programación 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 película Flash. Absolutamente de todo. Sin embargo, en estos temas sólo vamos a ver una pequeña introducción a ActionScript 3 que servirá para sentar las bases que permitirán empezar a trabajar con ActionScript.

CARACTERISTICAS GENERALES

1-Como ya hemos comentado, el ActionScript es el lenguaje de programación propio de Flash, tal y como el Lingo lo es de Macromedia Director

2-como su nombre lo 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.

3-ActionScript 3 Tiene similitudes, por tanto, con lenguajes tales como los usados en el Microsoft Visual Basic y aunque, evidentemente, no tiene la potencia de estos lenguajes, cada versión se acerca más. Así, la versión 3.0 utilizada en Flash CS5 es mucho más potente y mucho más "orientada a objetos" que su anterior versión 2.0.

 4-Las diferencias entre JavaScript y ActionScript las podemos encontrar en la ayuda que acompaña al Flash CS5.

Panel de acciones

 Panel Acciones sirve para programar scripts con ActionScript, por tanto lo que 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 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  (en el nombre de la pestaña de la zona de la derecha y en la zona izquierda en el apartado Selección actual).

El panel de 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 que Flash tiene predefinidos.

En la parte derecha tenemos el espacio para colocar nuestro script, el código de ActionScript.

El Panel Acciones de Flash CS5, no tiene únicamente un modo de edición. Podemos utilizar el , en el que en vez de escribir directamente, seleccionamos los distintos elementos desde listas.

En la parte superior encontramos herramientas que nos ayudarán:

 Buscar: Busca un texto en el código. Ú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 paréntesis o corchetes. Si encuentra alguno, nos mostrará un mensaje como el siguiente:

 Formato automático. Al escribir en cualquier lenguaje, es muy importante hacerlo ordenadamente y con el formato adecuado. Este botón lo hace automáticamente, siempre que no haya errores de sintaxis. Cuando tenemos mucho código, nos resultará más cómodo si contraemos ciertas partes. Con estos botones, podemos, de izquierda a derecha, contraer el espacio entre llaves, contraer la selección o expandir todo.

Cuando estamos programando, es frecuente que queramos comentar un fragmento de código para que no se ejecute o que queramos añadir comentarios descriptivos. Con estos botones, podemos comentar el texto seleccionado, o descomentarlo.

Aunque la sintaxis sea correcta, puede que al probar nuestra película se sigan produciendo errores (errores de compilación).

panel de fragmentos de códigos

En Flash CS5 se ha creado un nuevo panel para ayudarnos a generar el código ActionScript: el panel Fragmentos de código.

Este panel nos resultará muy útil, ya que incluye las funciones básicas. Por ejemplo, los eventos de botones siempre se escriben de la misma forma. Desde la sección Controladores de eventos del panel, podemos introducir este código, y sólo modificar la parte necesaria.

Pero además accediendo a sus opciones encontramos opciones muy interesantes:

Los operadores y expresionesEntrando un poco más a fondo en la sintaxis y el

manejo del ActionScript, vamos a comenzar hablando de los operadores y de las expresiones, por ser la parte más elemental de una acción de ActionScript (y de cualquier otro lenguaje 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.

Operador Descripción Ejemplo

+ Suma 5 + 5 = 10

- Resta 5 - 5 = 0

* Multiplicación 5 * 5 = 25

/ División 5 / 5 = 1

% Resto o Módulo 10%8 = 2

++ Incremento. Suma 1 al valor

valor++ equivaldría a valor = valor + 1

-- Decremento. Resta 1 al valor

valor-- equivaldría a valor = valor - 1

 Operadores Aritméticos

Operadores de Asignación

  

Operador Descripción Ejemplo

=Asigna a la variable de la izquierda el valor de la derecha

variable vale 3;variable = 5;variable vale 5;

+=

Suma con asignación. Le añade a la variable el valor de la derecha.

variable vale 3;variable += 5;variable vale 8;

-=Resta con asignación. Le resta el valor de la derecha.

variable vale 3;variable -= 5;variable vale -2;

*= Multiplicación con asignación.

variable vale 3;variable *= 5;variable vale 15;

/= División con asignación

variable vale 15;variable /= 5;variable vale 3;

Operadores de Asignación

Operador Descripción Ejemplo

=Asigna a la variable de la izquierda el valor de la derecha

variable vale 3;variable = 5;variable vale 5;

+=Suma con asignación. Le añade a la variable el valor de la derecha.

variable vale 3;variable += 5;variable vale 8;

-= Resta con asignación. Le resta el valor de la derecha.

variable vale 3;variable -= 5;variable vale -2;

*= Multiplicación con asignación.variable vale 3;variable *= 5;variable vale 15;

/= División con asignaciónvariable vale 15;variable /= 5;variable vale 3;

 Operadores de Comparación

Operador Descripción Ejemplo

> Mayor que 6 > 5 da verdadero.

< Menor que 6 < 5 da falso.

>= Mayor o igual que

6 >= 5 da verdadero.

<= Menor o igual que

6 >= 6 da verdadero.

== Igual 'hola' == 'hola' da verdadero.

!= Distinto 'hola' != 'hola' da falso.

 Operadores lógicos.Operador Descripción Ejemplo

&&

And (Y) Devuelve verdadero si los dos valores son verdaderos

(6 > 5) && (1==1) devuelve verdadero(6 > 5) && (1==0) devuelve falso

||

Or (O) Devuelve verdadero si alguno de los valores es verdadero

(6 > 5) || (1==1) devuelve verdadero(6 > 5) || (1==0) devuelve verdadero(6 > 6) || (1==0) devuelve falso

!

Not (Negado) Devuelve verdadero si el valor era falso, y al revés.

!(9 > 2) devuelve falso!(9 ==9) devuelve falso

Los objetosLos Objetos, como ya hemos visto en el tema básico, los

objetos son instancias de una determinada clase. Esto es, son representantes de una clase ya definida. Cada objeto tiene las propiedades y métodos propios de la clase, y normalmente son independientes unos de otros. 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 CS5.

 Objeto "Button"

(Botón)Los objetos de tipo Botón es un tipo de MovieClip especialmente pensado para que el usuario interactúe con él, permitiéndonos diferenciar entre sus estados, y crear una apariencia para cada uno.

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. 

Métodos mas comunes

Estas acciones son funciones predefinidas de ActionScript, es decir: Flash CS5 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.

Por supuesto, cuando tengamos más conocimientos, veremos que no es difícil completar estas acciones ya creadas con las nuestras propias.

Explicaremos las Acciones más importantes, y a medida que avancemos en el curso, añadiremos algunas más. Para una referencia más completa, recomendamos mirar la ayuda del programa.

Las acciones son métodos de los objetos (funciones internas a estos), por lo que no todas están disponibles para todos los objetos.

Acciones - Control de películaEstas 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...

Ejemplos de actionscript

Vamos a mostrar los usos más característicos de código ActionScript en los diferentes objetos existentes en Flash CS5. De este modo lo comprenderemos mejor y porqué no, nos ahorraremos trabajo al tener ya hechos aquí muchos de los códigos que usaremos en nuestras películas. Mostraremos el código y a continuación, una explicación del mismo.

Algunas cosas que debemos de tener en cuenta si estamos familiarizados con la programación en ActionScript 2, es que con ActionScript 3.0 no podemos utilizarlos.

alert() La forma de tratar eventos, como on (event){},

onClipEvent(event){}, object.onEvent = function(){} , addListener .

Guiones bajos ( _ ) antes del nombre de las propiedades. Variables globales (_global). _root y _parent para acceder a elementos superiores.

Código ActionScript para botones

Los Botones (objeto Button para Flash CS5) tienen mucha utilidad siempre que queramos que nuestra película interactúe con el usuario. Dado que esto va a ser prácticamente siempre, es conveniente estudiar y entender bien algunos códigos típicos que tendremos que usar para conseguir nuestros propósitos.

En realidad, los botones se comportan como cualquier símbolo. A todos les podemos aplicar eventos, ya que lo que hacemos es asociarlos normalmente al clic del ratón. Los botones tienen la ventaja de que nos permiten representar distintos estados, mejorando la percepción de interactividad.

Código ActionScript para Clips de película

Los Clips de Película (objeto MovieClip) son películas dentro de películas. Pueden tener código AS dentro de sí mismos, aunque suele ser más común que algún otro código externo (situado en fotogramas) les haga referencia. 

El objeto MATH

Como ya sabemos, los objetos no visibles también se controlan con ActionScript. Vamos a ver algunos ejemplos del funcionamiento del objeto Math y cómo sacarle partido.

x = Math.random();El método random del objeto Math genera un

número aleatorio entre 0 y 1. En este caso, el resultado lo almacenamos en la variable x, para poder usarlo después...

Las utilidades de este método son muchas, generar claves secretas,

navegacion

En este tema veremos los puntos más importantes en los que te podrás apoyar para realizar tus animaciones en Flash usando ActionScript.

Esta unidad, la de Navegación, está especialmente orientada a la web, pues veremos cómo crear elementos que te ayudarán más tarde a crear tus propias presentaciones, secciones, etc. Todo ello apoyado con animaciones y vinculadas entre sí.

A lo largo del tema utilizaremos este ejemplo para ilustrar la teoría de forma guiada.

Los Botones

 

Uno de los elementos que más nos van a ayudar a la hora de añadir interactividad en el diseño son los botones.

En el ejemplo nos hemos ayudado de los botones para crear la navegación entre las diferentes secciones.

Controladores de la línea de tiempoUna vez insertados los botones y definidos los eventos

sobre los que deben actuar, tendremos que decidir qué queremos que hagan.

De esta forma podremos crear dinamismo entre nuestras secciones.

Imagina que tenemos la siguiente línea de tiempo:

Las escenas

Flash permite el uso de escenas para separar diferentes temas en una sola película. Se suelen utilizar sobre todo en animaciones, donde una parte de la acción transcurre sobre un fondo y la siguiente sobre otro completamente diferente.

De este modo podemos usar las escenas para representar diferentes secciones muy diferentes en nuestra película, por ejemplo, crear una escena para el cargador, otra para la película principal y una tercera para una sección que se diferencie completamente del resto y nos sea más cómodo trabajar con ella independientemente.

A pesar del hecho de que las escenas se trabajan como líneas de tiempo diferentes, al crear el archivo SWF éstas se alinean en orden reproduciéndose una detrás de otra.

Por ello, al publicar el documento los fotogramas de las escenas se numerarán respecto a esto. Es decir, si tenemos una primera escena que va del fotograma 1 al 50, la segunda escena comenzará en el fotograma 51.

Los MovieClips

En el tema de Clips de Película vimos que se tratan de objetos con línea de tiempo propia.

Podemos utilizarlos para incluir elementos en nuestra película con una animación independiente. De este modo aunque la película principal esté detenida el clip seguirá actuando según su propio cabezal de reproducción.

Existen métodos para manejar la línea de tiempo de los clips, idénticas a las anteriores, y que veremos a continuación.

Lo primero que deberemos aprender es a acceder a las propiedades y métodos de los objetos. Esto es un recurso muy utilizado pero a la vez es muy sencillo. Lo veremos con un ejemplo.

Queremos que al pulsar un botón el movieclip avance en su línea de tiempo hasta su fotograma 20.

Pero, ¿qué pasa si queremos ejecutar la orden desde dentro de clipPadre? Imagina que dentro del movieclip hay un botón y el clip clipHijo. Queremos que al pulsar el botón se reproduzca el fotograma 20 de clipHijo, entonces deberíamos escribir lo siguiente en las acciones del botón.

Las variables

Las variables son contenedores donde podremos almacenar información para trabajar con ella. Esta información puede ser modificada y leída.

Aunque parece un concepto muy complejo su uso es bastante sencillo.

En ActionScript existen muchos tipos diferentes de variables, de hecho en una variable podemos guardar cualquier tipo de objeto. Vamos a ver ahora los más comunes, los que emplearemos para guardar texto, números o valores booleanos (verdadero - falso).

Boolean: o booleano, puede almacenar sólo dos valores, o true (verdadero) o false (falso). 

Number: puede almacenar números enteros o decimales, positivos o negativos. El signo decimal en ActionScript es el punto (.). Podrás realizar operaciones matemáticas con estas variables.

String: puede almacenar cadenas de caracteres, es decir, un conjunto de caracteres alfanuméricos. Las variables de tipo String deben ir entre comillas dobles ("cadena") o ('cadena').

Array: en los arrays o matrices podemos almacenar distintos valores en distintas posiciones. A estas posiciones accedemos con un índice numérico (utilizando 0 para la primera posición) que indicamos entre corchetes tras el nombre del array (nombreArray[3]=valor;). Puedes ver un ejemplo práctico de los arrays en este básico.

Las funciones

Como habrás visto en los ejemplos anteriores, una función es un bloque de código que podemos utilizar en cualquier parte del archivo, siempre que haya sido definida en el mismo o en un fotograma anterior. Si definimos una función dentro de otra tendrá un ámbito local, como ocurría con las variables.

Como ya hemos visto, las funciones se definen con la palabra function.