ActionScript

1. INTRODUCCIÓN A ACTIONSCRIPT
ActionScript es el lenguaje asociado a Flash. Ha ido variando mucho
desde sus inicios por lo que actualmente tenemos 3 versiones del
lenguaje muy diferentes. A medida que ha pasado el tiempo el
lenguaje se ha hecho más robusto y versátil.
ActionScript3
ActionScript3 es el lenguaje de programación que utiliza Flash CS3
y Flash CS4. Se trata de un lenguaje orientado a objetos.
Inicialmente ActionScript era un lenguaje orientado a eventos, pero
poco a poco y debido al potencial de la orientación a objetos esto ha
ido cambiando. Gracias a ActionScript3 podemos estructurar el
código de nuestras aplicaciones de forma más clara y sencilla.
Una de las desventajas de ActionScript3 es que requiere escribir
más código que las anteriores versiones, sin embargo existen
herramientas que facilitan enormemente la tarea de programar con
ActionScript (FlashDevelop, Eclipse).
Entorno De Desarrollo
A la hora de programar con ActionScript 3 han surgido varios
programas a parte de Flash que nos permiten editar el código con
un conjunto mayor o menor de facilidades. Hoy en día la gran
mayoría de programadores experimentados trabaja con estos
editores, puesto que algunos de ellos disponen de herramientas
muy potentes. Algunos de los editores más utilizados son:
Flash IDE: El editor de Flash viene equipado con un panel que
permite la edición de ActionScript. Se trata de la opción más básica,
y a pesar de que versión a versión lo van mejorando, todavía le
queda mucho para alcanzar la potencia de otros editores de código.
FlashDevelop: Se trata de un editor de código muy potente y a la
vez relativamente sencillo de empezar a utilizar. Otra de las
ventajas es que es software libre. Permite trabajar con proyectos

2. compuestos por muchos archivos. Tiene muchas ayudas que
benefician tanto al programador que acaba de empezar como al
programador experto. La gran desventaja es que no funciona en
todos los Mac.
Referencia: http://www.flashdevelop.org
Eclipse: Se trata también de una herramienta de software libre.
Éste editor de código comenzó trabajando para programar con Java.
Sin embargo tiene muchos plug-ins que permiten editar código de
otros lenguajes con casi las mismas facilidades. Incorpora también
muchas facilidades, más incluso que FlashDevelop, pero resulta más
complicado configurarlo. Además el rendimiento de la aplicación
puede disminuir al tener muchos plug-ins activos.
Referencia: http://www.eclipse.org
Flex Builder: Es la otra opción de Adobe para programar con
ActionScript. Se trata de un entorno de desarrollo orientado a
programadores (basado en Eclipse). Sin embargo ha sido creado
para el desarrollo de aplicaciones Flex, no aplicaciones Flash. Esto
hace que a veces resulte confuso trabajar con Flash y Flex Builder.
Referencia: http://www.adobe.com/products/flex/
Como recomendación, es útil aprender a trabajar con algún editor.
Para alguien que está aprendiendo FlashDevelop quizá sea la mejor
combinación potencia-facilidad de uso. Sin embargo si utilizas un
Mac quizá sea mejor plantearse utilizar Eclipse en un futuro un poco
más lejano y empezar desde Flash IDE.
Cómo Programar En Flash
La opción más básica de programar ActionScript. Sin embargo,
todos los programadores deben conocer como se trabaja a nivel de
código con esta herramienta. Existen dos formas de trabajar el
código en Flash:
Código dentro de la película FLA
Es habitual que en cualquier proyecto realizado en Flash
necesitemos introducir determinado código en la película. Por
ejemplo, es frecuente que necesitemos que una aplicación se
detenga al final de su reproducción y no se reproduzca en bucle.

3. El código se introduce en un panel llamado panel de Acciones, lo
podemos encontrar el en menú Ventana>Acciones o pulsando F9.
Lo único que hay que tener en cuenta es que el código solamente
puede situarse en fotogramas clave. Cuando un fotograma tiene
código asociado aparece marcado con la letra a minúscula. El código
se reproducirá cada vez que la cabeza lectora pase por ese
fotograma.
Buenas prácticas: Es recomendable crear una capa para el código
AS que introduzcamos de este modo. Esta capa no debiera contener
ningún contenido gráfico (fotogramas con fondo blanco) y
habitualmente se le asigna un nombre como “as” o “código”.
Código en archivos AS externos
Si abrimos o creamos un documento AS en Flash, veremos que el
área de trabajo es diferente. Ya no nos aparece el escenario, sino
que simplemente disponemos de un editor de código.
Función Trace
En el siguiente ejemplo vamos a hacer uso de la función trace. Esta
función se encarga de mostrar un mensaje en tiempo de diseño de
la película, es decir, un mensaje que el usuario no verá, sólo lo
veremos nosotros mientras probemos la película. Se trata de una
sentencia vital a la hora de buscar errores en la aplicación ya que
nos permite comprobar el flujo correcto del programa.
Los mensajes de trace aparecen por la ventana de salida. Una
ventana de texto mediante la cual la película puede dejarnos
mensajes durante su ejecución. Tiene la siguiente descripción:
function trace(mensaje:String):void
Esto quiere decir que se trata de una función, que se llama trace,
que tiene un parámetro llamado mensaje, y que no devuelve nada.
Para utilizarla se escribirá un código parecido a este:
trace("El mensaje que quieras mostrar por pantalla");
Fíjate bien que el texto del mensaje tiene que ir entre comillas
(pueden ser dobles o simples), como es un parámetro también va

4. entre paréntesis. También es importante que después de llamar a
esta función escribimos ;
NOTA: Para ejecutar la película pulsamos las teclas Ctrl+Enter
(Windows) o Manzana+Enter (Mac)
Ejemplo: Hola mundo
Crearemos un archivo FLA vacío y utiliza la función trace.
Asociaremos el código dentro de la película FLA, en el primer
fotograma de la película. En este ejercicio simplemente
mostraremos el texto "Hola mundo" por la pantalla de salida.
Ejercicio en clase: Conversación
Partiendo del ejercicio anterior. Añade un fotograma clave en el
fotograma 30 y muestra otra frase por la pantalla de salida en ese
momento. Genera varios fotogramas para simular una
conversación.
Por ejemplo:
Hola!
Hola, ¿qué tal?
Contento de verte, ¡cuánto tiempo!
...
Variables Y Tipos De Datos
Una variable se puede ver como un almacén de datos que tiene
asociado un nombre o identificador. Éste identificador puede
contener letras de la “a” a la “z”, números del 0 al 9, barra baja (_)
y simbolo de dólar ($).
Buenas prácticas: Habitualmente el nombre de la variable se
define con la primera letra de cada palabra en Mayúscula excepto la
primera letra que va en minúsculas. Sin dejar espacios entre
palabras.
Para utilizar una variable en ActionScript3 es necesario declararla
utilizando la palabra clave var. Cuando declaramos una variable, su
nombre lo inventamos nosotros. Resulta de mucha utilidad darle a

5. cada variable un nombre claro, breve y explicativo que nos ayude a
diferenciarla del resto de variables del programa.
var nombreDeLaVariable:TipoDeDatos;
A la variable se le puede dar un valor inicial cuando se declara.
var nombreDeLaVariable:TipoDeDatos = valorInicial;
Cuando ya hemos declarado una variable, y simplemente queremos
cambiar su valor ya no hace falta que utilicemos la palabra clave
var ni el tipo de datos.
nombreDeLaVariable = nuevoValor;
En cuanto al tipo de datos que puede contener es:
1) numéricos
Number para números con decimales, int para números enteros
(sin decimales) y uint para números enteros sin decimales
(0,1,2...).
var radio:Number = 2.5;
var i:int;
var contador:uint = 0;
Es habitual el uso de números en base hexadecimal (base 16), por
ejemplo para codificar colores.
(http://es.wikipedia.org/wiki/Sistema_hexadecimal) Para ello
predecemos el número siempre de 0x.
//Para un color de fondo blanco
var colorFondo:uint = 0xFFFFFF;
2) verdadero/falso
Boolean para almacenar un valor lógico verdadero o falso.
var inicializado:Boolean = true;
var hayError:Boolean = false
3) cadenas de texto
String para textos, los textos que utilicemos (textos literales)
siempre entre comillas

6. var nombre:String = "Elena";
var saludo:String = "Hola, ¿Qué tal?";
4) listas de elementos
Array para conjuntos ordenados de distintos elementos
var boletoPremiado:Array = [16, 23, 35, 36, 42, 62];
var nombres:Array = ["Anna", "Pablo", "Patricia"];
5) otros tipos de elementos
Object para cualquier tipo de objeto que define el programador.
Dentro de una variable almacenamos varios valores o propiedades
de un objeto.
var perro:Object = {nombre:"Toby", raza:"Pointer",
edad:7};
Ejercicio en clase: Tipos de datos
Indica cual es el tipo de datos que mejor se adecua para los
siguientes datos:
1) Altura de una persona medida en metros
2) El indicador de piso del ascensor de un edificio con parking
subterráneo
3) El estado de una lámpara: si está encendida o no
4) Mensaje de alerta de una aplicación
5) Ficha completa de un paciente de un hospital
6) La cola de la pescadería
Operadores
Los operadores nos sirven para crear expresiones. Se utilizan a la
hora de evaluar condiciones y de realizar cálculos con diferentes
tipos de datos.

7. Operador de asignación =
Ya lo hemos visto para inicializar una variable con un valor. Sirve
para cualquier tipo de datos.
var nombre:String = "Elena";
nombre = "Charo";
Aritméticos: + - * / % ++
//Suma
var radio:Number = 2.5;
//Si se suman dos Strings se obtiene la unión de
ambos
nombre = "Elena";
saludo = "Hola " + nombre;
//Al utilizar la variable nombre ya no ponemos
comillas, porque se trata de una variable (un
contenedor), no un texto literal.
//Resta
radio = 4 – 1.5;
//Multiplicación
var diametro:Number = radio * 2;
//División
radio = diametro / 2;
//Módulo o resto de la división entera
var dividendo:Number = 15;
var divisor:Number = 6;
var resto:Number = dividendo % divisor;
//Incremento de una variable
contador++;
radio++;
Comparativos: == > >= < <= !=

8. // es igual que
radio == 2.5
nombre == "Antonio"
// es mayor que
radio > 2
// es mayor o igual que
radio >= 2
// es menor que
radio < 17
// es menor o igual que
radio <= 17
// es distinto que
radio != 2
//El resultado de una expresión comparativa es de
tipo Boolean
var enLimites:Boolean = radio >= 2;
Lógicos: && || !
Se suelen utilizar expresiones con operadores comparativos e
incluso variables de tipo Boolean para elaborar expresiones más
complejas. El resultado de una expresión con operadores lógicos es
un Boolean.
//si ocurre esto Y esto
(nombre == "Elena") && (edad >= 18)
var enLimites:Boolean = (radio >= 2) && (radio <=
17);
//si ocurre esto O esto
var fueraLimites:Boolean = (radio < 2) || (radio >
17);
// si no ocurre que
!(radio == 2.5)
//uso de varios operadores con paréntesis
((nombre == "Maite") || (nombre == "Raul")) && (edad
>= 18)

9. Más operadores
Ejercicio en clase: Cálculo con variables
Indica en cada caso qué contiene la variable resultado en cada caso
si es que se puede calcular.
resultado = 10 + ((4 * 3) / 6);
Si ocurre que (apellido == "San Diego") && (nombre ==
"Carmen")
resultado = "Hola" + nombre + apellido;
Si ocurre que el valor anterior de resultado es "AB"
resultado = resultado + "C";
resultado = (radio < 2) && (radio > 17)
Si ocurre que (edad == 18)
resultado = !(edad < 18) || (nombre == "Irene);
Estructuras Alternativas O Condicionales
Las estructuras alternativas nos permiten crear diferentes ramas de
ejecución en un programa, es decir, ejecutar una parte u otra de
código dependiendo de una condición.
Las estructuras condicionales de las que dispone Flash son:
if - else - else if
La versión más simple de condicional:
* Si se cumple la condición se ejecuta cierto pedazo de código.
* Si la condición no se cumple, no se ejecuta nada.
if(condicion){
//Código a ejecutar
}
if((radio >= 2) && (radio <= 17)){
trace("El radio está entre 2 y 17 (incluídos)");
}

10. Al añadir la clausula else, pueden suceder dos cosas:
* Si se cumple la condición se ejecuta el código del bloque if
* Si no se cumple la condición se ejecuta el código del bloque else
if(condicion){
//Código a ejecutar
}else{
//Otro código a ejecutar
}
if((radio >= 2) && (radio <= 17)){
trace("El radio está entre 2 y 17 (incluídos)");
}else{
trace("El radio está fuera de límites");
}
Al añadir una clausula else if, se añade otra condición a la
estructura, se pueden añadir varias cláusulas else if.
* Se analizan las las condiciones empezando por la primera (if). Si
se cumple alguna, se ejecuta el código asociado a la primera de
ellas.
* Si no se cumple ninguna condición se ejecuta el código del bloque
else
if(condicion 1){
//Código a ejecutar 1
}else if(condicion 2){
//Código a ejecutar 2
}else if(condicion 3){
//Código a ejecutar 3
}else{
//Otro código a ejecutar
}
if(radio < 2){
trace("El radio inferior al mínimo");
}else if (radio > 17)){
trace("El radio superior al máximo");
}else{
trace("El radio está entre los límites");
}
switch-case
La estructura switch-case se utiliza para evaluar si una variable o
expresión es igual a uno o varios valores. La sentencia brake sirve

11. para dejar de ejecutar código, si no se especifica, se ejecuta
también el siguiente case. La cláusula default sirve cuando la
variable o expresión evaluada no se corresponde con los valores de
ninguno de los case especificados.
switch(expresion){
case valor1:
//Código asociado al valor 1;
break;
case valor2:
//Código asociado al valor 2;
break; //...
default:
//Código asociado al valor por defecto;
break;
}
switch(tipoUsuario){
case "amigo":
trace("Ey colega!!");
break;
case "jefe":
case "conocido":
trace("Buenos días.");
break;
case "enemigo":
trace("¬¬");
break;
default:
trace("Hola!");
break;
}
Buenas prácticas: ¡Siempre bien tabulado!
Ejercicio en clase: Operadores y alternativas
Crea un archivo FLA. Realizaremos algunas operaciones de las que
acabamos de ver y utilizaremos la función trace().
Dispondremos de tres variables nombre, sexo y edad que se
declararán e inicializarán al principio del programa. En función del
sexo y la edad elaboraremos una frase indicando que esa persona
pertenece a uno de los grupos siguientes.

12. de 0 a 16 de 16 a 30 a partir de 30
hombre niño hombre joven hombre adulto
mujer niña mujer joven mujer adulta
Estructuras Repetitivas
Las estructuras repetitivas nos permiten ejecutar un pedazo de
código varias veces. Son muy útiles para recorrer listas por
ejemplo. Las estructuras repetitivas en ActionScript3 son:
while
Uno de los bucles más utilizados. Repite la ejecución de cierto
pedazo de código mientras se cumple determinada condición. Sin
embargo, si al evaluar la condición, esta no se cumple, no se vuelve
a ejecutar el código. La evaluación de la condición se lleva a cabo
antes de la ejecución del código, por lo tanto es una repetitiva de
0-N (de 0 a N).
while(condición){
//Código a repetir
}
var contador:uint = 0;
while(contador < 20){
trace("contador: "+ contador);
contador++;
}
do-while
Muy semejante al while, se utiliza menos. La diferencia es que es
una repetitiva de 1-N, es decir, siempre se ejecuta al menos una
vez. Esto se debe a que la condición se evalúa después de la
ejecución del código.
do{
//Código a repetir

13. }while(condición)
var contador:uint = 0;
{
trace("contador: "+ contador);
contador++;
}while(contador < 20)
for
También muy utilizada, sobre todo para recorrer listas. Se trata de
una sentencia especial que integra:
* inicialización: sentencia de código que se ejecuta al principio del
bucle (var i:int = 0)
* condición: mientras se cumpla se ejecutará el código (0-N)
* incremento: sentencia de código que se ejecuta al final de cada
vuelta del bucle y antes de evaluar la condición para la siguiente
vuelta. Habitualmente un incremento o decremento (i++)
for(inicialización; condición; incremento){
//Código a repetir
}
for(var i:int = 0; i<20; i++){
trace("contador: " + i);
}
Buenas prácticas: ¡Siempre bien tabulado!
Es común mezclar varios bucles, es lo que se llama bucles
anidados. La idea es que utilizamos un bucle dentro de otro bucle.
Lo único que tenemos que hacer es utilizar bien las condiciones, lo
que a veces requiere que usemos variables diferentes para los
bucles anidados.
for(var i:int = 0; i<20; i++){
for(var j:int = 0; j<10; j++){
trace("coordenadas: " + i + " " + j);
}
}
Trabajando con bucles es habitual cometer errores en las
condiciones y llegar a lo que se llama "bucle infinito". Se trata de
un programa que tiene un bucle del cual no se puede salir. Parecerá

14. que Flash se nos cuelga, al cabo de un tiempo Flash nos dice que
hay un script ejecutandose durante mucho tiempo que si lo
queremos parar. Indicamos que si.
Ejercicio para casa: Rectángulo con trace
Vamos a dibujar un rectángulo hecho con el carácter X llamando
varias veces a la función trace().
Seguidamente intentaremos dibujar una línea horizontal. Para ello
crearemos una variable linea, que la inicializamos a "" (es decir, un
texto sin ningún carácter). Utilizando un bucle concatenaremos
caracteres utilizando el operador +. Luego haremos un trace de
linea, quedará algo así:
XXXXX
Finalmente repetiremos todo esto dentro de otro bucle para crear la
figura siguiente:
XXXXX
XXXXX
XXXXX
Acuérdate de utilizar variables diferentes en los bucles que utilices
si utilizas bucles anidados.
Prueba a dibujar algo más complicado: un triángulo, un rectángulo
vacío,...
X
XX
XXX
XXXX
XXXXX
XXXXXXX
X X
X X
X X
XXXXXXX
Funciones

15. Las funciones son porciones de código reutilizable que se pueden
utilizar en varias ocasiones realizando lo que se denomida “llamada”
a la función. Las funciones también poseen un identificador o
nombre. Éste identificador puede contener letras de la “a” a la “z”,
números del 0 al 9, barra baja (_) y simbolo de dólar ($).
Buenas prácticas: Habitualmente el nombre de la función se
define con la primera letra de cada palabra en Mayúscula excepto la
primera letra que va en minúsculas. Sin dejar espacios entre
palabras.
Para utilizar una función en ActionScript3, antes es
necesario definirla utilizando la palabra clavefunction.
function nombreFuncion():void{
}
Para llamar a una función siempre lo haremos utilizando paréntesis
después de su nombre. Esto es lo que distingue una función de una
variable (aunque realmente las funciones son como variables).
nombreFuncion();
Parámetros
A las funciones se le pueden pasar parámetros. Los parámetros
son unas variables que se definen dentro de la función (Y no tienen
porque funcionar fuera de la función). En la definición de la función
la lista de parámetros describe el conjunto de variables que se
encargarán de recoger los valores pasados por parámetro.
function nombreFuncion(parametro1:Tipo1,
parametro2:Tipo2):void{
}
En la llamada a la función se utiliza como parámetros la lista de
valores que se utilizarán para ejecutar la función. Éstos valores
pueden ser variables, expresiones o literales (ejemplo:1, true,
"Hola")
nombreFuncion(2,"Albert");

16. Retorno
Cuando una función devuelve un valor, a este valor se le
llama retorno. El retorno de una función puede ser de cualquier
tipo mencionado anteriormente.
function nombreFuncion():TipoRetorno{
return valorDeRetorno;
}
var resultado:TipoRetorno = nombreFuncion();
Es muy habitual la combinación entre parámetros y retornos.
Ejercicio en clase: Leer una función
Responde a las preguntas sobre la siguiente función:
function dibujar(caracter:String, lado:uint):uint{
for(var i:int = 0; i<lado; i++){
var linea:String = "";
for(var j:int = 0; j<lado; j++){
if(i == j){
linea = linea + caracter;
}else{
linea = linea + " ";
}
}
}
return lado * lado;
}
¿Cómo se llama la función?
¿Qué parámetros tiene?
¿Qué devuelve la función?
¿Qué realiza la función?

17. Ejercicio en clase: Encapsular código en una función
El siguiente código genera nombres aleatorios partiendo de sílabas,
aún no sabemos como funciona muy bien pero vamos a intentar
encapsularlo en una función.
var silabas:Array = ["sa","ca","tam","pa","ku"];
var nombre:String = "";
for(var i:int = 0; i<3; i++){
var aleatorio:Number =
Math.floor(Math.random()*silabas.length);
nombre = nombre + silabas[aleatorio];
}
trace(nombre);
Paso 1. Generamos una función que se llame generarNombre y
metemos todo el código. Seguidamente realizaremos una llamada a
la función.
Paso 2. Parametrizar la función. Le agregaremos un parámetro: el
número de sílabas que se incluyen en el nombre. Después de
hacerlo prueba a crear nombres de varias longitudes.
Paso 3. Retorno de la función. En vez de realizar la sentencia de
trace la función devolverá el nombre como retorno. Y en lugar de la
llamada a la función que realizamos en el paso 1 realizaremos lo
siguiente:
var numeroAleatorio:uint = 2 +
Math.floor(Math.random()*3);
trace("Tu nuevo nombre es "+
generarNombre(numeroAleatorio));