Trabajo 2

¿QUÉ ES EL ACTIONSCRIPT?

 El ActionScript es el lenguaje de programación
que ha utilizado Flash desde sus comienzos, y
que por supuesto, emplea Flash CS5.
 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

 El ActionScript está basado en la
especificación ECMA-262, al igual que otros
lenguajes como Javascript.
 La aplicación de código actionscript en los objetos
ya existentes, películas que hacen lograr alcanzar
nuevos objetivos.
 Tiene similitudes por lo tanto utiliza es tipo de
lenguaje de Visual Basic.
 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.

 Actionscipt resulta mas familiarizada con java
script.
 Flash CS5 pone a nuestra disposición una
biblioteca de funciones, clases y métodos (de
momento entenderemos esto como "código
ActionScript que realiza una función
determinada")

 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

 El Panel Acciones se divide en 2 partes tenemos
en la parte izquierda una ayuda facilitada por
Flash que nos da acceso de un modo rápido y
muy cómodo a todas las acciones. En la 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. Veamos las más útiles
 buscar: Busca un texto en el código.
revisar sintaxis: Comprobará errores en la
sintaxis, normalmente que hayamos olvidado cerrar
paréntesis o corchetes.

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 automatico: al escribir en cualquier
lenguaje, es muy importante hacerlo
ordenadamente y con el formato adecuado.
 Cuando tenemos mucho código, nos resultará
más cómodo si contraemos ciertas partes.
 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.

Aunque la sintaxis sea correcta, puede que al probar
nuestra película se sigan produciendo errores (errores
de compilación). . 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.

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

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

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
valor++ equivaldr
Incremento.
++ ía a valor = valor
Suma 1 al valor
+1
valor--
Decremento.
-- equivaldría
Resta 1 al valor
a valor = valor - 1
 Son los operadores empleados en operaciones
matemáticas

 Asigna el valor de una variable

Asigna a la
variable vale 3;
variable de la
= variable = 5;
izquierda el valor
variable vale 5;
de la derecha
Suma con
asignación. Le variable vale 3;
+= añade a la variable += 5;
variable el valor variable vale 8;
de la derecha.
Resta con
variable vale 3;
asignación. Le
-= variable -= 5;
resta el valor de
variable vale -2;
la derecha.
variable vale 3;
Multiplicación
*= variable *= 5;
con asignación.
variable vale 15;
variable vale 15;
División con
/= variable /= 5;
asignación
variable vale 3;

6 > 5 da
> Mayor que
verdadero.
< Menor que 6 < 5 da falso.
Mayor o igual 6 >= 5 da
>=
que verdadero.
Menor o igual 6 >= 6 da
<=
que verdadero.
'hola' == 'hola'
== Igual
da verdadero.
'hola' != 'hola'
!= Distinto
da falso.
 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.

(6 > 5) &&
And (Y)
(1==1) devuelve
Devuelve
verdadero
&& verdadero si los
(6 > 5) &&
dos valores son
(1==0) devuelve
verdaderos
falso
(6 > 5) || (1==1)
devuelve
Or (O) Devuelve
verdadero
verdadero si
(6 > 5) || (1==0)
|| alguno de los
devuelve
valores es
verdadero
verdadero
(6 > 6) || (1==0)
devuelve falso
Not (Negado)
!(9 > 2)
Devuelve
devuelve falso
! verdadero si el
!(9 ==9)
valor era falso, y
devuelve falso
al revés.

Normalmente se emplean para comparar dos expresiones con operadores
relacionales, y devuelve verdadero o falso.

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

1if (edad_usuario<18) {
2 dar_mensaje_1();
3} else {
4 dar_mensaje_2();
5}

 Cuando en una expresión se combinan varios operadores, el
orden en que se ejecutan puede variar el resultado de la
expresión, por eso es muy importante saber en qué orden se
ejecutarán. El orden no es aleatorio sino que sigue unas reglas
de precedencia al igual que en una operación matemática.
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 (=, +=, -=...)

 ( ) : Paréntesis. Sirven, como es de esperar, para
agrupar términos y dar preferencias en las
operaciones (al igual que en matemáticas).
 " " : Comillas. En ActionScript, todo lo que va entre
comillas, pasa a considerarse una cadena de
caracteres.
 //: 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.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

 Los Métodos y Propiedades suelen ser específicos de
cada objeto, y su estudio requeriría un nuevo curso
completo, (recomendamos consultar la ayuda
incorporada en el Flash CS5 cuando surjan dudas),
pero hay bastantes propiedades de los objetos que
son comunes a muchos de ellos. Vamos a ver las más
utilizadas, que afectan a los objetos de visualización,
que son con los que trabajaremos habitualmente.
 Hay que entender que las clases se heredan. Es
decir, una clase genérica, tiene subclases más
concretas. Las sublaceses, tienen todos los métodos
y propiedades de la clase de la que heredan, y
además agregan sus propios métodos y funciones

 Propiedades de DisplayObject, comunes a todos los objetos que se
visualizan.
 alphaHace 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. heightDevuelve o establece 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) widthPropiedad idéntica a la anterior,
pero devuelve o establece la anchura. visibleDetermina si el objeto
está o no visible en nuestra película. Cuando vale 1 o True, lo está,
cuando vale 0 o False, 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; ... .... xCon
esta propiedad obtenemos o establecemos las coordenadas del
objeto respecto del eje de las X (horizontal). Sirve para averiguar la
posición o para asignarla de forma dinámica (durante la ejecución de
nuestra película Flash) yCon esta propiedad obtenemos las
coordenadas del objeto respecto del eje de las Y (vertical). Sirve para
averiguar la posición o para asignarla de forma dinámica (durante la
ejecución de nuestra película Flash). rotationCon esta propiedad
obtenemos o establecemos el giro del objeto, su rotación, expresado
en grados. nameCon esta propiedad obtenemos o establecemos el
nombre de la instancia.

 framesloaded: son los fotogramas de la pelicula
que el sistema lleva cargados en la memoria.
Muy útil para crear cargadores.
 Totalframes: devuelve la cantidad de fotogramas
que contienes el clip de pelicula. También usado
en la creación de cargadores.
 currentFrame: indica el número de frame en el
que se encuentra la cabeza de reproducción del
MovieClip.

 Creamos dos rectángulos, y los convertimos a símbolos, uno
como botón y otro como clip de película. Lo primero que
debemos hacer es darles un nombre de instanciaPara ello, y
con el símbolo seleccionado abrimos el panel Propiedades

 Remplazamos el texto <nombre de instancia> por el
nombre. Por ejemplo boton_reducir para el botón
y rectángulo para el clip

 Vamos al panel de acciones, y
escribimos el siguiente código

1 boton_reducir.addEventListener(MouseEvent.CLICK, encogerRectangulo);
2
3 function encogerRectangulo(event):void
4 {
5 rectangulo.height = rectangulo.height / 2;
6 rectangulo.width = rectangulo.width / 2;
7 }

 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
utilizar:
 alert()
 La forma de tratar eventos, como on (event){},
onClipEvent(event){}, object.onEvent = function(){} ,
addListener , etc. La forma de tratarlos ahora es
agregando un escuchador al objeto, con el
método addEventListener, indicando el evento, y una
única función de escucha.
 Guiones bajos ( _ ) antes del nombre de las propiedades.
 Variables globales (_global).
 _root y _parent para acceder a elementos superiores.

Trabajo 2

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (16)

Destacado

Destacado (6)

Similar a Trabajo 2

Similar a Trabajo 2 (20)

Trabajo 2