2. INTRODUCCIÓN
¿QUÉ ES EL ACTIONSCRIPT?
Es un programa que ha utilizado flash y nos sirve
de mucho para hacer películas y otras cosas su
uso es muy fácil.
3. CARACTERÍSTICAS GENERALES
el ActionScript es el lenguaje de programación
propio de Flash.
ActionScript es, como su nombre indica, un
lenguaje de script.
ActionScript 3 es un lenguaje de programación
orientado a objetos.
La sintaxis ActionScript presenta muchísimos
parecidos con el Java scrip o PHP.
Flash CS5 pone a nuestra disposición una
biblioteca de funciones, clases y métodos
4. 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. 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).
5.
6. 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. Puede resultar útil al
principio, cuando aún no estamos familiarizados,
pero nos limita mucho al escribir.
En la parte superior encontramos herramientas que
nos ayudarán. Veamos las más útiles:
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:
7. En el panel Errores de compilador se mostrarán los errores indicando la capa,
fotograma y línea. Podemos ir al lugar del error haciendo doble clic.
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.
8. Aunque la sintaxis sea correcta, puede que al probar nuestra
película se sigan produciendo errores (errores de
compilación). 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 también nos aparecerán en el panel Errores de
compilador. En este caso, fíjate en el número de línea del
error, ya que al hacer doble clic, a veces no va al lugar
correcto si el código tiene comentarios.
9. EL PANEL FRAGMENTOS DE CÓDIGO
En Flash CS5 se ha creado un nuevo panel para
ayudarnos a generar el código ActionScript: el
panel Fragmentos de código.
10. Pero además accediendo a sus opciones encontramos
opciones muy interesantes:
Lo más destacado es que podemos crear nuestros
propios fragmentos de código, con intruscciones que
usemos habitualmente.
Además podemos exportarlas e importarlas a otras
instalaciones del programa.
11. LOS OPERADORES Y EXPRESIONES
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.
Por ejemplo:
x = 3 ; --> Es una expresión cuyo resultado será asignarle a la
variable ' x ' el valor 3 (que es una constante). A partir de este
punto, la variable x vale 3.
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 8 a y. También se puede considerar como asignar
a y el valor de la expresión 5 + x
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 Elementos de
lenguaje → Operadores. Vamos a clasificar los operadores tal y
cómo lo hace Flash.
12. OPERADORES ARITMÉTICOS
Son los operadores empleados en operaciones
matemáticas.
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++ equivaldría
++
valor a valor = valor + 1
Decremento. Resta 1 al valor-- equivaldría
--
valor a valor = valor - 1
13. OPERADORES DE ASIGNACIÓN
Asigna el valor de una variable.
Operador Descripción Ejemplo
Asigna a la variable de la variable vale 3;
= izquierda el valor de la variable = 5;
derecha variable vale 5;
Suma con asignación. Le variable vale 3;
+= añade a la variable el valor variable += 5;
de la derecha. variable vale 8;
variable vale 3;
Resta con asignación. Le
-= variable -= 5;
resta el valor de la derecha.
variable vale -2;
variable vale 3;
Multiplicación con
*= variable *= 5;
asignación.
variable vale 15;
variable vale 15;
/= División con asignación variable /= 5;
variable vale 3;
14. OPERADORES DE COMPARACIÓN
Empleados en expresiones condicionales,
devuelven un valor lógico, verdadero (TRUE o 1) si
la comparación es cierta, o falso (FALSE o 0) si no
lo es.
Operador Descripción Ejemplo
> Mayor que 6 > 5 da verdadero.
< Menor que 6 < 5 da falso.
6 >= 5 da
>= Mayor o igual que
verdadero.
6 >= 6 da
<= Menor o igual que
verdadero.
'hola' == 'hola' da
== Igual
verdadero.
'hola' != 'hola' da
!= Distinto
falso.
15. OPERADORES LÓGICOS.
Evalúan valores lógicos. Normalmente se emplean
para comparar dos expresiones con operadores
relacionales, y devuelve verdadero o falso.
Operador Descripción Ejemplo
(6 > 5) && (1==1) devuelve
And (Y) Devuelve verdadero si verdadero
&&
los dos valores son verdaderos (6 > 5) && (1==0) devuelve
falso
(6 > 5) || (1==1) devuelve
Or (O) Devuelve verdadero si verdadero
|| alguno de los valores es (6 > 5) || (1==0) devuelve
verdadero verdadero
(6 > 6) || (1==0) devuelve falso
Not (Negado) Devuelve
!(9 > 2) devuelve falso
! verdadero si el valor era falso,
!(9 ==9) devuelve falso
y al revés.
16. 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 menor de edad, le decimos una cosa, de
lo contrario, le decimos otra. Bastaría con hacer algo
así:
1 if (edad usuario<18) {
2 dar_mensaje_1();
3 } else {
4 dar_mensaje_2();
5 }
Aquí lo que estamos diciendo es lo siguiente: "Si edad
usuario es menor a 18, entonces damos el mensaje 1,
si no (igual o superior a 18) le damos el mensaje 2.
17. ORDEN DE PRECEDENCIA
En la siguiente tabla, vemos el orden de
precedencia, de mayor a menor, se ejecutan
primero los de mayor orden.
Orden de precedencia
Negación (!) / Incremento (++) / Decremento (--)
Multiplicación (*) / División (/) / Resto (%)
Suma (+) / Resta (-)
Relacionales mayor - menor (>, <, >=, <=)
Igualdad (==) / Desigualdad (!=)
And lógico (&&)
Or lógico (||)
Asignación (=, +=, -=...)
18. OTROS ELEMENTOS DEL LENGUAJE
( ) : Paréntesis. Sirven, como es de esperar, para agrupar
términos y dar preferencias en las operaciones (al igual que
en matemáticas). También se usa, como ya vimos, para pasar
parámetros a funciones o acciones.
" " : Comillas. En ActionScript, todo lo que va entre comillas,
pasa a considerarse una cadena de caracteres. 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.
//: Comentario de línea. Indica que el texto a partir de ahí, y
en esa línea, es un comentario, y no se ejecutará como
código.
/* ....... */: Comentario de bloque. Cualquier texto de una o
más líneas encerrado entre estos caracteres es un
comentario, y no se ejecutará como código.
19. LOS OBJETOS
Los 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.
Vamos a ver los objetos más usados en Flash y una breve
descripción de cada uno de ellos. Como ya se ha explicado
en el tema básico, cada objeto tiene una serie
dePropiedades (que veremos después),
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. Podemos
encontrar una lista con todas las propiedades, métodos
y Acciones.
20. 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.
Cuando nos interese que una imagen que hayamos
diseñado se comporte como un botón, bastará
convertirla a botón (del modo visto en el capítulo
correspondiente) y ya podremos usar los eventos
típicos de un botón.
21. 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
independiente 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, por ejemplo).
Realmente, toda nuestra película es un MovieClip.
22. OBJETO "DISPLAYOBJECT" (OBJETO DE
VISUALIZACIÓN)
Esta clase engloba a todos los objetos que
podemos ver en nuestra película, como los Clips de
película y botones, y define las propiedades y
métodos comunes para todos ellos.
23. OBJETO "SOUND" (SONIDO)
Y SOUNDCHANEL (CANAL DE 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... Utilizando el canal de
sonido, podremos pararlo, ajustar el volumen, etc.
Podríamos, por ejemplo, crear un objeto de tipo
sonido y después hacer que al pulsar un botón
suene. (Más adelante se verá algún ejemplo de uso
de sonidos).
24. 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.
25. OBJETO "MATCH" (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 matemáticas de modo muy
sencillo. En el tema siguiente veremos algún
ejemplo de su uso.
26. 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..
27. OBJETO "LOADER" (CARGADOR) Y OBJETO
"URLLOADER" (CARGADOR DE INFORMACIÓN)
Los objetos Loader nos permitirán cargar archivos
para mostrarlos (imágenes, archivos swf, etc...) en
nuestra película, mientras que los objetos
URLLoader nos permitirán cargar información de
archivos (archivos de texto, XML, páginas web...).
28. LAS ACCIONES - MÉTODOS COMUNES
Flash CS5 llama acciones a lo referente al código ActionScript, lo que
nos permite dar comportamientos a los objetos.
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.
Definiremos las acciones escribiendo su cabecera (nombre +
parámetros con un nombre genérico) para después explicar qué es cada
parámetro.
29. 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...
Estas acciones son métodos de la clase
MovieClip. Podemos aplicarlas a cualquier
MovieClip de nuestra película, siguiendo el
siguiente formato:nombreMovieClip.accion();. Si
escribimos la función directamente, es decir, si no
indicamos el objeto, estamos haciendo
referencia a la película general.
30. VEAMOS LAS MÁS IMPORTANTES PARA
ENTENDERLAS MEJOR:
gotoAndPlay: Esta acción será, probablemente la que
más usemos durante la realización de nuestras
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í.Sintaxis:
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 (una etiqueta),
debe ir entre comillas dobles, si es un número, no.
31. Ejemplo:
miClip.gotoAndPlay("Escena2", 7); → Esta acción
lleva la cabeza lectora al fotograma 7 de la escena
llamada "Escena2" del MovieClip con el nombre de
instanciamiClip.play: Da comienzo a la
reproducción de la película o la continúa desde el
punto detenido.Sintaxis:
play();
No tiene Parámetros.Ejemplo:
this.play(); → Inicia la reproducción del objeto
actual.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..Sintaxis:
stop();
No tiene Parámetros.
32. ACCIONES - NAVEGADOR / RED
fscommand: Esta acción, es capaz de ejecutar ciertos comandos muy
potentes. Lo más cómodo es pasar a Asistente de Script (sino
estábamos ya) e insertarla, nos aparecerá una pestaña con los posibles
comandos que admite. Sirve para interactuar con la aplicación que
reproduce la película, por ejemplo Flash Player o el navegador web,
como IE o Firefox. Veamos esos comandos:fullscreen (true o false): Si
se activa pone nuestra película a pantalla completa. Muy útil para
presentaciones en CD-Rom, por ejemplo.
allowscale (true o false): 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.
showmenu (true o false): 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.
33. trepallkeys (true o false): Sirve para detectar las
pulsaciones de todas las teclas durante la reproducción
de nuestras películas.
exec (ruta de la aplicación): Ejecuta una aplicación
desde el reproductor.
quit (ninguno): Cierra el reproductor Flash.
Todas estas alternativas, comparten modo de uso,
veámoslo:Sintaxis:
fscommand(comando, [argumentos])comando: El
comando a ejecutar (fullscreen, allowscale, etc...)
argumentos: En la mayoría de los casos debemos
escribir true o false, según queramos desactivar la
opción o activarla. Por ejemplo, en el caso del
comando quit lo dejaremos vacío.
Ejemplo:
fscommand("fullscreen", "true"); -> Activa la pantalla
completa.navigateToURL() : Esta acción se emplea
para abrir el navegador web e ir a la página i
34. navigateToURL() : Esta acción se emplea para abrir el navegador web e
ir a la página indicada.Sintaxis:
navigateToURL(url , [ventana]);url: Dirección web a la que queremos
acceder (se abrirá una ventana). Este parámetro es un objeto del
tipo URLRequest. Si queremos utilizar una dirección como cadena de
texto, podemos hacerlo escribiendo new
URLRequest("http://www.direccion.coms").
ventana: Parámetro OPCIONAL. Modo en el que queremos abrir la
ventana (en la ventana actual (_self) en otra nueva (_blank) etc...).
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
algunas Acciones, ¿Cómo indicarle a Flash que "si la variable x = 3,
entonces vaya al fotograma 5, y si no, vaya al fotograma 10"?. Sabemos
comparar, sabemos ir a los fotogramas, pero no sabemos decirle a Flash
"Si pasa esto, haz una cosa, y si no, 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 "si no ...", nos encontramos de repente con todas las
herramientas para decirle a Flash: "si (pasa una condición) {haz esto} si
no {haz lo otro}"
Veamos antes que nada su sintaxis para comprenderlo mejor:Sintaxis:
if (condición) {sentencia_si_se_cumple; } else {sentencias_si_no; }if:
Indica que acción que viene a continuación entre paréntesis es una
condición.
35. Ejemplo:
navigateToURL(new URLRequest("http://www.aulaclic.es"), "_blank"); -->
Abre la web de aulaClic en una ventana nueva.load(): Este método nos
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), en un objeto de la clase Loader, o cargar información en un
objeto URLLoader. Para utilizarlo, primero tenemos que crear un objeto
de este tipo.Sintaxis:
objetoCargador.load(direccion:URLRequest, [contexto]);direccion:
Dirección absoluta o relativa donde está situada la película SWF o la
imagen a cargar. Es un objeto URLRequest, como en el caso
de navigateToURL().
contexto: Es un parámetro opcional, en el que se indica algunas
propiedades más avanzadas que no veremos en este curso.
Ejemplo:
var cargadorPeli:Loader = new Loader(); -> Creamos un objeto Loader
donde cargar el archivo.
cargadorPeli:Loader.load(new URLRequest("archivo.swf"));->
LLamamos al método load() para que cargue el archivo indicado.
Nota: Cargamos el archivo en nuestra película, pero no lo mostramos.
Para verlo, tenemos que añadir el cargador a la lista de visualización,
como ya veremos, por ejemplo conaddChild(cargadorPeli);. Acciones -
Condiciones
36. condicion: Indica una condición que debe cumplirse, es decir, 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. La condición siempre debe de ir entre
paréntesis.
sentencia_si_se_cumple;: Conjunto de acciones que sucederán si la
condición se evalúa como verdadera. Estas sentencias deben de ir
entre llaves. Podemos poner el bloque de código que queramos: varias
líneas, objetos, otros if...
else: Especifica la alternativa si condición se evalúa a falsa. Es
optativo. Si no existe, y no se cumple la condición, no se hará nada,
pues no lo hemos especificado.
sentencias_si_no; Conjunto de acciones que sucederán si la condición
se evalúa como falsa. Deben incluirse entre llaves.
Ejemplo:
if (x == 2) {miClip.gotoAndPlay(6); } --> Si la variable x vale 2, entonces
saltamos al fotograma 6 de miClip, si no, 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.