Introduccin *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 ms robusto y verstil.

ActionScript3
ActionScript3 es el lenguaje de programacin 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 orientacin a objetos esto ha ido cambiando.
Gracias a ActionScript3 podemos estructurar el cdigo de nuestras
aplicaciones de forma ms clara y sencilla.
Una de las desventajas de ActionScript3 es que requiere escribir ms
cdigo 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 cdigo con un conjunto mayor o
menor de facilidades. Hoy en da la gran mayora de programadores
experimentados trabaja con estos editores, puesto que algunos de ellos
disponen de herramientas muy potentes. Algunos de los editores ms
utilizados son:
*Flash IDE*: El editor de Flash viene equipado con un panel que permite
la edicin de ActionScript. Se trata de la opcin ms bsica, y a pesar
de que versin a versin lo van mejorando, todava le queda mucho para
alcanzar la potencia de otros editores de cdigo.
*FlashDevelop*: Se trata de un editor de cdigo 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 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 tambin de una herramienta de software libre. ste
editor de cdigo comenz trabajando para programar con Java. Sin embargo
tiene muchos plug-ins que permiten editar cdigo de otros lenguajes con
casi las mismas facilidades. Incorpora tambin muchas facilidades, ms
incluso que FlashDevelop, pero resulta ms complicado configurarlo.
Adems el rendimiento de la aplicacin puede disminuir al tener muchos
plug-ins activos.
Referencia: http://www.eclipse.org
*Flex Builder*: Es la otra opcin 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 recomendacin, es til aprender a trabajar con algn editor. Para
alguien que est aprendiendo FlashDevelop quiz sea la mejor combinacin
potencia-facilidad de uso. Sin embargo si utilizas un Mac quiz sea
mejor plantearse utilizar Eclipse en un futuro un poco ms lejano y
empezar desde Flash IDE.

Cmo programar en Flash

La opcin ms bsica de programar ActionScript. Sin embargo, todos los
programadores deben conocer como se trabaja a nivel de cdigo con esta
herramienta. Existen dos formas de trabajar el cdigo en Flash:
*Cdigo dentro de la pelcula FLA *
Es habitual que en cualquier proyecto realizado en Flash necesitemos
introducir determinado cdigo en la pelcula. Por ejemplo, es frecuente
que necesitemos que una aplicacin se detenga al final de su
reproduccin y no se reproduzca en bucle.
El cdigo 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 cdigo solamente puede
situarse en fotogramas clave. Cuando un fotograma tiene cdigo asociado
aparece marcado con la letra a minscula. El cdigo se reproducir cada
vez que la cabeza lectora pase por ese fotograma.
Buenas prcticas: Es recomendable crear una capa para el cdigo AS que
introduzcamos de este modo. Esta capa no debiera contener ningn
contenido grfico (fotogramas con fondo blanco) y habitualmente se le
asigna un nombre como as o cdigo .
*Cdigo 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 cdigo.

Funcin trace
En el siguiente ejemplo vamos a hacer uso de la funcin trace. Esta
funcin se encarga de mostrar un mensaje en tiempo de diseo de la
pelcula, es decir, un mensaje que el usuario no ver, slo lo veremos
nosotros mientras probemos la pelcula. Se trata de una sentencia vital
a la hora de buscar errores en la aplicacin 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 pelcula puede dejarnos mensajes durante su
ejecucin. Tiene la siguiente descripcin:
function trace(mensaje:String):void
Esto quiere decir que se trata de una funcin, que se llama trace, que
tiene un parmetro llamado mensaje, y que no devuelve nada. Para

utilizarla se escribir un cdigo parecido a este:

trace("El mensaje que quieras mostrar por pantalla");
Fjate bien que el texto del mensaje tiene que ir entre comillas (pueden
ser dobles o simples), como es un parmetro tambin va entre parntesis.
Tambin es importante que despus de llamar a esta funcin escribimos ;
*NOTA: *Para ejecutar la pelcula pulsamos las teclas Ctrl+Enter
(Windows) o Manzana+Enter (Mac)
Ejemplo: Hola mundo
Crearemos un archivo FLA vaco y utiliza la funcin trace. Asociaremos
el cdigo dentro de la pelcula FLA, en el primer fotograma de la
pelcula. En este ejercicio simplemente mostraremos el texto "Hola
mundo" por la pantalla de salida.
Ejercicio en clase: Conversacin
Partiendo del ejercicio anterior. Aade 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 conversacin.
Por ejemplo:
Hola!
Hola, qu tal?
Contento de verte, cunto tiempo!
...
Variables y tipos de datos
Una variable se puede ver como un almacn de datos que tiene asociado un
nombre o identificador. ste identificador puede contener letras de la
a a la z , nmeros del 0 al 9, barra baja (_) y simbolo de dlar ($).
*Buenas prcticas:* Habitualmente el nombre de la variable se define con
la primera letra de cada palabra en Mayscula excepto la primera letra
que va en minsculas. 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 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) numricos
*Number* para nmeros con decimales, *int* para nmeros enteros (sin
decimales) y *uint* para nmeros enteros sin decimales (0,1,2...).
var radio:Number = 2.5;
var i:int;
var contador:uint = 0;
Es habitual el uso de nmeros en base hexadecimal (base 16), por ejemplo
para codificar colores.
(http://es.wikipedia.org/wiki/Sistema_hexadecimal) Para ello predecemos
el nmero siempre de 0x.
//Para un color de fondo blanco
var colorFondo:uint = 0xFFFFFF;
2) verdadero/falso
*Boolean* para almacenar un valor lgico 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
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 subterrneo
3) El estado de una lmpara: si est encendida o no
4) Mensaje de alerta de una aplicacin
5) Ficha completa de un paciente de un hospital

6) La cola de la pescadera
Operadores
Los operadores nos sirven para crear expresiones. Se utilizan a la hora
de evaluar condiciones y de realizar clculos con diferentes tipos de datos.
*Operador de asignacin =*
Ya lo hemos visto para inicializar una variable con un valor. Sirve para
cualquier tipo de datos.
var nombre:String = "Elena";
nombre = "Charo";

*Aritmticos: + - * / % ++*
//Suma
var radio:Number = 2.5;
//Si se suman dos Strings se obtiene la unin 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;

//Multiplicacin
var diametro:Number = radio * 2;
//Divisin
radio = diametro / 2;
//Mdulo o resto de la divisin entera
var dividendo:Number = 15;
var divisor:Number = 6;
var resto:Number = dividendo % divisor;
//Incremento de una variable
contador++;
radio++;

*Comparativos: == > >= < <= !=*

// 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 expresin comparativa es de tipo Boolean
var enLimites:Boolean = radio >= 2;

*Lgicos: && || !*
Se suelen utilizar expresiones con operadores comparativos e incluso
variables de tipo Boolean para elaborar expresiones ms complejas. El
resultado de una expresin con operadores lgicos 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 parntesis
((nombre == "Maite") || (nombre == "Raul")) && (edad >= 18)

Ms operadores
<http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/operators.html>

Ejercicio en clase: Clculo 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

ejecucin en un programa, es decir, ejecutar una parte u otra de cdigo
dependiendo de una condicin.
Las estructuras condicionales de las que dispone Flash son:
*if - else - else if*
La versin ms simple de condicional:
* Si se cumple la condicin se ejecuta cierto pedazo de cdigo.
* Si la condicin no se cumple, no se ejecuta nada.
if(condicion){
//Cdigo a ejecutar
}
if((radio >= 2) && (radio <= 17)){
trace("El radio est entre 2 y 17 (includos)");
}
Al aadir la clausula else, pueden suceder dos cosas:
* Si se cumple la condicin se ejecuta el cdigo del bloque if
* Si no se cumple la condicin se ejecuta el cdigo del bloque else
if(condicion){
//Cdigo a ejecutar
}else{
//Otro cdigo a ejecutar
}
if((radio >= 2) && (radio <= 17)){
trace("El radio est entre 2 y 17 (includos)");
}else{
trace("El radio est fuera de lmites");
}
Al aadir una clausula else if, se aade otra condicin a la estructura,
se pueden aadir varias clusulas else if.
* Se analizan las las condiciones empezando por la primera (if). Si se
cumple alguna, se ejecuta el cdigo asociado a la primera de ellas.
* Si no se cumple ninguna condicin se ejecuta el cdigo del bloque else
if(condicion 1){
//Cdigo a ejecutar 1
}else if(condicion 2){
//Cdigo a ejecutar 2
}else if(condicion 3){
//Cdigo a ejecutar 3
}else{
//Otro cdigo a ejecutar
}
if(radio < 2){
trace("El radio inferior al mnimo");
}else if (radio > 17)){
trace("El radio superior al mximo");
}else{
trace("El radio est entre los lmites");
}

*switch-case*
La estructura switch-case se utiliza para evaluar si una variable o
expresin es *igual* a uno o varios valores. La sentencia brake sirve
para dejar de ejecutar cdigo, si no se especifica, se ejecuta tambin
el siguiente case. La clusula default sirve cuando la variable o
expresin evaluada no se corresponde con los valores de ninguno de los
case especificados.
switch(expresion){
case valor1:
//Cdigo asociado al valor 1;
break;
case valor2:
//Cdigo asociado al valor 2;
break; //...
default:
//Cdigo asociado al valor por defecto;
break;
}
switch(tipoUsuario){
case "amigo":
trace("Ey colega!!");
break;
case "jefe":
case "conocido":
trace("Buenos das.");
break;
case "enemigo":
trace("");
break;
default:
trace("Hola!");
break;
}
*Buenas prcticas:* 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 funcin trace().
Dispondremos de tres variables nombre, sexo y edad que se declararn e
inicializarn al principio del programa. En funcin del sexo y la edad
elaboraremos una frase indicando que esa persona pertenece a uno de los
grupos siguientes.

de 0 a 16

de 16 a 30

a partir de 30
hombre

nio

hombre joven

hombre adulto
mujer

nia

mujer joven

mujer adulta

Estructuras repetitivas
Las estructuras repetitivas nos permiten ejecutar un pedazo de cdigo
varias veces. Son muy tiles para recorrer listas por ejemplo. Las
estructuras repetitivas en ActionScript3 son:
*while*
Uno de los bucles ms
de cdigo mientras se
evaluar la condicin,
cdigo. La evaluacin
ejecucin del cdigo,

utilizados. Repite la ejecucin de cierto pedazo

cumple determinada condicin. Sin embargo, si al
esta no se cumple, no se vuelve a ejecutar el
de la condicin se lleva a cabo antes de la
por lo tanto es una *repetitiva de 0-N* (de 0 a N).

while(condicin){
//Cdigo 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 condicin se evala despus de la ejecucin del cdigo.
do{

//Cdigo a repetir
}while(condicin)
var contador:uint = 0;
{
trace("contador: "+ contador);
contador++;
}while(contador < 20)

*for*
Tambin muy utilizada, sobre todo para recorrer listas. Se trata de una
sentencia especial que integra:
* inicializacin: sentencia de cdigo que se ejecuta al principio del
bucle (var i:int = 0)
* condicin: mientras se cumpla se ejecutar el cdigo (0-N)
* incremento: sentencia de cdigo que se ejecuta al final de cada vuelta
del bucle y antes de evaluar la condicin para la siguiente vuelta.
Habitualmente un incremento o decremento (i++)
for(inicializacin; condicin; incremento){
//Cdigo a repetir
}
for(var i:int = 0; i<20; i++){
trace("contador: " + i);
}
*Buenas prcticas:* Siempre bien tabulado!
Es comn 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 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: Rectngulo con trace
Vamos a dibujar un rectngulo hecho con el carcter X llamando varias
veces a la funcin trace().
Seguidamente intentaremos dibujar una lnea horizontal. Para ello
crearemos una variable linea, que la inicializamos a "" (es decir, un
texto sin ningn carcter). 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
Acurdate de utilizar variables diferentes en los bucles que utilices si
utilizas bucles anidados.
Prueba a dibujar algo ms complicado: un tringulo, un rectngulo vaco,...
X
XX
XXX
XXXX
XXXXX
XXXXXXX
X
X
X
X
X
X
XXXXXXX
Funciones
Las funciones son porciones de cdigo reutilizable que se pueden
utilizar en varias ocasiones realizando lo que se denomida llamada a
la funcin. Las funciones tambin poseen un identificador o nombre. ste
identificador puede contener letras de la a a la z , nmeros del 0 al
9, barra baja (_) y simbolo de dlar ($).
*Buenas prcticas:* Habitualmente el nombre de la funcin se define con
la primera letra de cada palabra en Mayscula excepto la primera letra
que va en minsculas. Sin dejar espacios entre palabras.
Para utilizar una funcin en ActionScript3, antes es necesario
*definirla* utilizando la palabra clave *function*.
*function* nombreFuncion*()*:void{
}
Para *llamar* a una funcin siempre lo haremos utilizando parntesis
despus de su nombre. Esto es lo que distingue una funcin de una

variable (aunque realmente las funciones son como variables).

nombreFuncion*()*;

*Parmetros*
A las funciones se le pueden pasar *parmetros*. Los parmetros son unas
variables que se definen dentro de la funcin (Y no tienen porque
funcionar fuera de la funcin). En la definicin de la funcin la lista
de parmetros describe el conjunto de variables que se encargarn de
recoger los valores pasados por parmetro.
*function* nombreFuncion(parametro1:Tipo1, parametro2:Tipo2):void{
}
En la llamada a la funcin se utiliza como parmetros la lista de
valores que se utilizarn para ejecutar la funcin. stos valores pueden
ser variables, expresiones o literales (ejemplo:1, true, "Hola")
nombreFuncion(2,"Albert");

*Retorno*
Cuando una funcin devuelve un valor, a este valor se le llama
*retorno*. El retorno de una funcin puede ser de cualquier tipo
mencionado anteriormente.
*function* nombreFuncion():TipoRetorno{
return valorDeRetorno;
}
var resultado:TipoRetorno = nombreFuncion*()*;

Es muy habitual la combinacin entre parmetros y retornos.

Ejercicio en clase: Leer una funcin

Responde a las preguntas sobre la siguiente funcin:
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;
}

Cmo se llama la funcin?

Qu parmetros tiene?
Qu devuelve la funcin?
Qu realiza la funcin?

Ejercicio en clase: Encapsular cdigo en una funcin

El siguiente cdigo genera nombres aleatorios partiendo de slabas, an
no sabemos como funciona muy bien pero vamos a intentar encapsularlo en
una funcin.
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 funcin que se llame generarNombre y metemos todo
el cdigo. Seguidamente realizaremos una llamada a la funcin.
Paso 2. Parametrizar la funcin. Le agregaremos un parmetro: el nmero
de slabas que se incluyen en el nombre. Despus de hacerlo prueba a
crear nombres de varias longitudes.
Paso 3. Retorno de la funcin. En vez de realizar la sentencia de trace
la funcin devolver el nombre como retorno. Y en lugar de la llamada a
la funcin 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));