INSTITUTO SUPERIOR TECNOLOGICO PUBLICO

MARIA ROSARIO ARAOZ PINTO

DEPARTAMENTO DE COMPUTACION E INFORMATICA

INDICE

1.- TUTORIAL DE ACTIONSCRIPT 2.0 EN FLASH 02

2.- PROGRAMACIÓN ORIENTADA A OBJETOS EN ACTIONSCRIPT 2 09

3.- CREAR UN SONIDO PERMANENTE (LOOP) POR MEDIO DE ACTIONSCRIPT 23

4.- USO DE LA CLASE COLOR DE FLASH 24

5.- USAR CSS EN FLASH 28

6.- MOVIMIENTO DE UNA BANDERA DINÁMICAMENTE POR ACTIONSCRIPT 33

7.- CREAR SCROLLBAR MÁS EFECTO DE EASING 34

1
1.- TUTORIAL DE ACTIONSCRIPT 2.0 EN FLASH

http://www.cristalab.com/tutoriales/21/tutorial-de-
actionscript-2.0-en-flash

Introducción
Macromedia creo Flash 3, y con el introdujo un, hasta entonces, desconocido concepto en el mundo
Flash, la programación. Primitivos play, stop y gotoAndPlay poblaron entonces el diccionario de
ActionScript de la epoca. Vino Flash 4 luego, acompañado de las estructuras de programación; fue
entonces cuando los ciclos y las condiciones se mostraron al universo Flash.
Flash 5, en convenio con un poderoso aliado (ECMA) dio vida a una nueva visión de ActionScript,
convirtiendose en la sintaxis ECMA, elegida desde tiempos inmemoriales por su hermano JavaScript y
engendrada de C, unico lenguaje original.
XML, LoadVars, OOP y muchos mas conceptos desfilaban uno a uno hacia ActionScript, pero ningun
suceso marcaria tanto la mente de los flasheros como ahora, en MX 2004; ActionScript 2.0

Dejando un poco la introducción cyberpunk, ActionScript 2.0 realmente es un increible avance,

volviendose totalmente estandar, totalmente orientado a objetos y con muchisimas novedades, Flash MX
2004 trae este nuevo lenguaje (La segunda versión de ActionScript) a un nivel mas alla de las
aplicaciones ricas en medios orientadas a la web.

Este tutorial pretende ser una guia de migración desde Flash 5 y MX hacia MX 2004, en lo referente a su
lenguaje de programación y un poco de su modelo de componentes; NO PRETENDE ser una guia basica
de programación ni un tutorial de ActionScript desde cero
Se espera que el lector tenga las nociones basicas de programación, que haya manejado antes un poco
de ActionScript y que use actualmente Flash MX 2004 (Que es lo que dice el titulo, no? :D )

Indice
1. Variables en Flash MX 2004; Strong Data Typing
2. Imagenes en campos de texto
3. Cascade Style Sheeting, CSS en campos de texto
4. Personalizando los componentes MX 2004 con CSS
5. Nuevo modelo de eventos en los componentes V2
6. Clases y programación orientada a objetos

Variables en Flash MX 2004; Strong Data Typing

Existen varios lenguajes que nos acostumbran a malas mañas, como no tener la
necesidad de declarar las variables antes de usarlas o no asignarles un tipo de datos
(Lease Visual Basic, aunque PHP [la versión anterior] tiene algo de eso).
Desgraciadamente, Flash tiene un poco de todo, en Flash no hay necesidad de declarar
variables para usarlas y una variable puede ser "multi" tipo de datos, por ejemplo, si
asigno primero a una variable un String y luego un numero, no habria problema; asi:

variable = "Patito";
trace(variable);
variable = 1337;
trace(variable);
//Esto mostrara en pantalla primero "Patito" y luego "1337"
//Sin ningun error de compilación

Esto, aunque parezca una ventaja, es un grave error de codificación que genera "malas practicas de
programación".
Pues hay buenas noticias, para todos los puristas de la programación y para los novatos que inician con
Flash; ActionScript 2.0 incluye la declaración de tipo de datos en una variable (Strong Data Typing), es

2
decir, si declaras una variable de tipo numero y le asignas un String, Flash te mostrara un error y tu
usaras solo los tipos de dato que deben ser usados; ejemplo:

var miNumero:Number;
miNumero = 31337;
trace(miNumero);
miNumero = "Cristalab";
trace(miNumero);
Que generara esta salida en la ventana OutPut:
**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 4: Type mismatch
in assignment statement: found String where Number is required.
miNumero = "Cristalab";
Total ActionScript Errors: 1 Reported Errors: 1
Veamos entonces la estructura de la declaración de variables:

var nombreDeVariable:TipoDeDato;

Aqui cambia que siempre vamos a declarar la variablepara ponerle el tipo de dato, asi, todas las
declaraciones inician con la palabra clave var, ademas, despues del nombre de la variable pondremos el
signo de dos puntos seguido por el tipo de dato; si quieres una lista de los tipos de datos disponibles,
escribe el signo de dos puntos y una lista aparecera ante ti, aqui un ejemplo.

Lista de tipos de datos

No solo eso, ahora tambien detectara mayusculas y minusculas, es decir, una variable llamada miClab
sera dintitna a MiClab, la M mayuscula la hace completamente diferente, asi que ha tener cuidado con
el "case sensitive" de Flash MX 2004.
Como nota final, todas las clases inherentes y objetos internos de Flash pueden ser declarados com
oobjetos (Por ejemplo, XML)

Imagenes en campos de texto

Asi es, ahora podemos introducir imagenes externas JPG dentro de los campos de texto de Flash por
medio del soporte HTML en los campos de texto, asi que si tengo un campo de texto al que le asigno el
siguiente codigo HTML:
<p align='center'><font color='#990000'>Prueba de HTML en Flash MX
2004</font></p>
<img src='Foto.jpg' />Esto es una <b>prueba</b> de como <i>Flash MX
2004</i> soporta HTML e imagenes
incrustadas en sus campos de texto<br />Mucho mas poderoso que
<u>Flash MX</u>
La apariencia de ese campo de texto, tomando como base que existe el archivo Foto.jpg en la misma
carpeta; seria:

3
 Imagen de un SWF con un campo de texto con contenido HTML

figura Esto nos da muchisima mas flexibilidad en cuanto a manejo de datos dinamicos en nuestras
interfaces de Flash; ademas, no solo nos deja cargar imagenes externas; si yo creo un MovieClip cuyo
punto de registro (Es decir el centro de la figura) sea la esquina superior izquierda y lo exporte para
ActionScript con un nombre, tambien podre incluirlo dentro de Flash, no importa si es estatico o
animado; por ejemplo, si creamos un MovieClip de una cualquiera y al crear el MovieClip colocamos
esto:

Cuadro de dialogo "Convertir a Simbolo"

4
Y en el codigo HTML, en la etiqueta IMG, cambio el "Foto.jpg" por el nombre que le di para ActionScript
(En este caso "Clab"); el campo se podria ver asi:

La imagen es creada con Flash y esta dentro de un Movie Clip

Cascade Style Sheeting, CSS en campos de texto

En pro de los estandares de la web, Macromedia incluyo soporte a hojas de estilo en cascada dentro de
Flash MX 2004, asi que podemos crear todos nuestros estilos de manera externa y luego incluirlos dentro
de los campos de texto para asi hacer mas facil y logico el proceso de información+diseño.

Por ejemplo, crearemos un archivo "estilo.css" con este contenido:

titulo {
font:"Times New Roman", Times, serif;
text-align:center;
font-size:14px;
font-weight:bold;
color:#003399;
}
subtitulo {
text-align:right;
color:#999999;
font-size:9px;
}
contenido {
margin-left:5px;
font:Arial, Helvetica, sans-serif;
color:#000000;
text-align:left;
}

Crearemos un campo de texto dinamico, de nombre "campo_txt"; luego, colocamos este codigo en el
primer keyFrame de la pelicula:

//Creo un objeto de tipo Hoja de Estilo

var miEstilo:TextField.StyleSheet = new TextField.StyleSheet();
//Cargo dentro de el, el archivo CSS externo
miEstilo.load("estilo.css");
//Se lo asigno al campo de texto
campo_txt.styleSheet = miEstilo;
//De acuerdo a las etiquetas personalizadas dentro del CSS, creo el
contenido

5
var texto:String = "<titulo>Cristalab, website dedicado a Flash MX
2004</titulo>\n";
texto += "<subtitulo>Lleno de tutoriales, ejemplos y hasta un
comic</subtitulo>";
texto += "<contenido>Este website, encontrado por casualidad en los
perdidos rincones de Google ";
texto += "da una visión profesional de las nuevas herramientas de
desarrollo en contenidos ";
texto += "dinamicos para la web, especializandose en Macromedia Flash
MX 2004</contenido>";
//Se lo asigno al campo de texto
campo_txt.htmlText = texto;

El bonito resultado, seria este:

Campo de texto con el contenido HTML parseado por medio de CSS

Ahora bueno, al igual que Flash no soporta todo el HTML, tampoco soporta todo el CSS, pero digamos
que soporta el "justo y necesario" para lo que necesites; por favor, refierete a la ayuda de Flash (Tecla
F1) para mas información detallada

Personalizando los componentes MX 2004 con CSS

Esto da para un tutorial completo (El "skineo" de componentes es todo un arte), pero solo mostrare lo
mas importante, usar CSS para personalizar componentes.

Este ejemplo sencillo modificara de manera global los componentes CheckBox, RadioButton, List,
Button, TextArea y NumericStepper

/*Creamos una variable que modificara los estilos globalmente,

asignandole cada uno
de los estilos de componente a modificar */
var estiloGlobal = _global.styles.Button=_global.styles.CheckBox=
_global.styles.TextArea=_global.styles.RadioButton=_global.styles.
List
=_global.styles.NumericStepper = new
mx.styles.CSSStyleDeclaration();
//Le asignamos a la variable distintos tipos de estilo compatibles con
el estandar CSS
estiloGlobal.backgroundColor = 0xEFF3F7;
estiloGlobal.color=0x666666;
estiloGlobal.fontFamily = "Verdana";
estiloGlobal.shadowColor=0xFFFFFF;

6
Y no solo eso, tambien podemos hacer "temas" para los componentes, es decir, crear cada uno de sus
elementos (Barras de scroll, fondos, bordes) para personalizar aun mas nuestra interfaz.
Un ejemplo de como quedaria seria algo asi:

Apariencia de los componentes despues de "skinnear" y aplicarles CSS

Nuevo modelo de eventos en los componentes V2

Estrenamos un nuevo modelo de eventos tambien en esta versión de Flash, ahora, podemos eventar los
componentes directamente como haciamos con un boton y no por medio de funciones, listeners y
demas; un punto mas en pro de la usabilidad; para el ejemplo, arrastraremos el componente "Button" al
escenario y manteniendolo seleccionado desplegamos el panel de ActionScript, donde , si escribimos on(
se desplegaran los eventos asociados a este componente como en la grafica:

Eventos del componente Button

Asi que si colocamos el siguiente codigo:

on (click) {
trace("No me presiones :(");
}
Obtendremos al clickear el boton, la siguiente salida:

Pero hagamoslo mas interesante, creemos un campo de texto dinamico en el escenario, le ponemos de
nombre de instancia campo_txt y en el code del boton ponemos:

on (click) {
_parent.campo_txt.text="No me presiones :@";
}
Y el texto aparecera en el campo de texto :D

7
¿ Por que _parent ?

En los componentes, todo componente instanciado es, en escencia, un movie clip, asi que todo tipo de
codigo que le asocies ira con el "scope" o alcance de variables del movie clip que lo compone; como el
campo de texto estaba un nivel arriba del MovieClip que compone al boton, existe la necesidad de usar
_parent, aunque _root funcionaria igual.
Muchos otros componentes funcionan asi, asi que no duden en oprimir F1 ante cualquier duda (O
contarnos en los foros de Cristalab).

Clases y programación orientada a objetos

Este punto seria tema para todo un tutorial completo, pero intentare abarcar una visión general de la
OOP.
Flash ahora incluye programación orientada a objetos real, es decir, para los que han sido
programadores, herencia, polimorfismo, interfaces, vamos, como Java (Solo que no hay sobrecarga de
metodos[info solo para programadores] )

La tecnica tambien es similar a Java, creas un archivo externo con extensión .as que tenga el mismo
nombre que la clase que viene escrita en el y luego lo importas a Flash, para tener mas claro esto;
vamos a crear una clase "cuadrado" que nos dibuje ¬_¬ un cuadrado en donde le digamos (Y en nuestro
ejemplo, le diremos que lo haga en _root, es decir, en la linea de tiempo principal de la pelicula).

En Flash vamos al menu File -> New y en la lista desplegada elegimos ActionScript File.
Guardamos el archivo con el nombre Cuadrado.as y escribimos este codigo en el:

//Declaración de la clase
class Cuadrado{
/*Variable privada (Es decir, solo puede ser vista y modificada
por un metodo
de la clase; esta nos servira para saber donde vamos a
dibujar */
private var elLugar:MovieClip;
/*Constructor, esta es la función que se ejecutara
al crear una instancia de la clase, como cuando hago
var cosa = new String("Hola");, algo por el estilo ;) */
//Lo olvidaba, para que sea constructora debe tener el mismo
//nombre de la clase
function Cuadrado (lugar:MovieClip) {
//Asignamos a la variable privada de la clase la
variable que llega por parametro
this.elLugar = lugar;
}
//Función publica (Accesible desde el nombre de instancia de la
clase) que nos servira
//Para dibujar el cuadrado
public function drawCuadrado () {
var X:Number,Y:Number;
this.elLugar.createEmptyMovieClip("cuadro",1);
this.elLugar.beginFill(0xFF0000,90);
X=(this.elLugar._width/2)+100;
Y=(this.elLugar._height/2)+100;
this.elLugar.moveTo(X,Y);
X+=100;
this.elLugar.lineTo(X,Y);
Y+=100;
this.elLugar.lineTo(X,Y);
X-=100;
this.elLugar.lineTo(X,Y);
Y-=100;
this.elLugar.lineTo(X,Y);
this.elLugar.endFill();

8
 }
}
Y en una pelicula cualquiera colocamos solamente este codigo en el primer keyFrame:
//Trae nuestro archivo Cuadrado.as, no podemos colocar codigo de
clases
//Dentro de una pelicula, debe ser en un archivo externo
import Cuadrado;
//Creamos una nueva variable de tipo "Cuadrado", es decir, nuestra
clase
//Ahm!, pasandole como parametro al constructor _root, lugar donde
dibujara
var test:Cuadrado = new Cuadrado(_root);
//Invocamos al función publica drawCuadrado de nuestra clase
test.drawCuadrado();
Y veremos dibujado un lindo cuadrado en nuestro escenario :D

Conclusiones
Migrar de ActionScript 1.0 a 2.0 trae muchisimas ventajas, elimina muchas "malas mañas" de
programación y crea una nueva plataforma de desarrollo de RIAs (Rich Internet Applications) y
contenidos interactivos para la web de alto impacto y rapido desarrollo, tu solo debes dar el primer
paso :D
Ahora claro, muchas cosas quedaron por fuera, pero son cosas mas puntuales y de los que hay
tutoriales completos en Cristalab, como el objeto PrintJob, MovieClipLoader, los nuevos
componentes como el Acorddion, metodos de ordenación de Arrays muy complejos, mantenimiento
de proyectos con Flash Project y posible integración con CVSs y mucho mas!, ahora a experimentar.
emm, una recomendación final (Y antes de ponerme pesado), los archvios de ejemplo estan
disponibles para descarga, pero seria recomendable que ustedes mismos hicieran los ejemplos a
partir del tutorial y solo los usaran en caso de alguna falla y como dije anteriormente, nuestros
foros siempre estaran abiertos a sus preguntas

PROGRAMACIÓN ORIENTADA A OBJETOS EN ACTIONSCRIPT 2

http://www.cristalab.com/tutoriales/51/programacion-
orientada-a-objetos-en-actionscript-2
Desde que Xerox crease (En teoria) el concepto de objetos en nuestros computadores, la programación
orientada a objetos creo un nuevo paradigma del desarrollo en un nuevo entorno mucho mas modular y
practico para el programador.
Sin embargo, muchos lenguajes actuales han hecho que la programación estructurada prevalezca.

ActionScript 1.0 es un ejemplo de ellos; que, aunque tenia un sistema "pseudo" basado en objetos; en
realidad no implementaba como debia ser la POO y la hacia un poco abstracta para el desarrollador.
Ahora, la nueva versión de ActionScript, 2.0, ha cambiado este panorama, rigiendose a cabalidad con el
estandar ECMA (Al que se acojen lenguajes como JavaScript o C#) y con un toque de similaridad a Java.
Esto ha hecho mucho mas facil a los experimentados saltar de cualquier otro lenguaje a ActionScript y a
los principiantes aprender el camino de la fuerza de una manera mas sencilla.

Recomiendo antes de leer este tutorial; que si no tienes muchos conocimientos en ActionScript o estas
recien llegado a Flash MX 2004 leas el Tutorial de ActionScript 2.0 antes de continuar; asi mismo, se
requieren conocimientos basicos de programación.

Si eres un experto de la programación o ya sabes que es esto de la orientación a objetos, saltate esta
sección y ve directo a "Programación orientada a objetos en ActionScript 2.0"; si en cambio estas recien
llegado a este mundo o no sabes que es la POO, inicia desde aqui

Indice de contenidos

• ¿Que es la programación orientada a objetos?

9
 o Abstracción
o Encapsulación
o Herencia
• Programación orientada a objetos en ActionScript 2.0
o 1r Movimiento: Archivos externos .as, primera clase
o 2o Movimiento: Miembros y Abstracción
o 3r Movimiento: Encapsulación, getters y setters
o 4o movimiento: Clases abstractas, Herencia y super
o 5o Movimiento: Interfaces
• Conclusiones

¿Que es la programación orientada a objetos?

Esta tecnica en si, se basa en el modelo de la vida real; donde tenemos objetos y estos a su vez tienen
atributos y funciones (O en un lenguaje mas tecnico; propiedades y metodos)
Por ejemplo; la mayoria de ustedes tendra el objeto Impresora, este objeto tiene una propiedad color,
cuyo valor, probablemente sea gris, tambien tiene otras propiedades como "tener papel en la bandeja",
cuyo valor puede ser verdadero o falso; la impresora tambien tiene la función o metodo principal
Imprimir, que nos devuelve la hoja impresa, asi como el metodo Apagar, que no nos devuelve nada,
pero internamente apaga la impresora.

Esto es precisamente el ejemplo de un objeto; es un elemento (que puede ser considerado como una
variable) que nosotros programamos, asignandole propiedades y metodos, a esto se le llama Miembros
de la Clase.

Pero ademas, los objetos pueden tener otras caracteristicas especiales que veremos detalladamente:

1. Abstracción
2. Encapsulación
3. Polimorfismo
4. Herencia

Antes de empezar con cada uno debo aclarar, que el codigo en si que compone a un objeto se llama
Clase y cada nueva variable a la que le es asignado un tipo de Clase se llama Objeto; y advertir que el
polimorfismo no esta realmente dentro de Flash, asi como, para los mas experiementados, la herencia
multiple (Gomen Nasai).

Abstracción
Lo primero que se hace al construir un instrumento electronico es abstraer la mayoria de sus funciones;
observa, por ejemplo, tu monitor; tiene una cantidad increible de transistores, chips y elementos
electronicos que por medio de complejos mapas y rutas de electrones hacen que funcione como tal;
pero para hacerlo funcionar no necesitas saber eso; solo necesitas oprimir el boton de encendido y el
mismo guiara la electricidad por todo el flujo del circuito, analizara cada onda que llegue por sus cables
de conexión del computador transformandola de analoga a digital y haciando que cada uno de esos unos
y ceros aparezca como diferentes tonos de luminosidad frente a tus ojos ... pero tu solo oprimiste el
boton de encendido; solo llamaste a la función "encender" del objeto "Monitor" y el objeto lo hizo todo
dentro de si mismo; eso es abstraer los metodos de un objeto.

Ahora usemos el ejemplo de un objeto Persona, y todas sus caracteristicas.

En una Persona ocurre lo mismo; nosotros tenemos, por ejemplo, la función de hablar, que es una
abstracción de una serie de procesos electricos cerebrales, movimientos musculares y modulación del
aire; entonces, si creara un objeto Persona y quisiera hacerla hablar, abstraeria todas las cosas que
hacen que una persona hable en una sola función y llamaria a esa función cuando la necesite, pasandole
por parametro, lo que quiero que hable; tambien podria hacer que esa persona dijera su nombre si
asigno al objeto Persona la propiedad nombre y solicito su valor al pedirle que hable; todo esto en
codigo seria similar a :

10
//Declaro una nueva variable de tipo Persona; y por medio de new la
creo en memoria
var sandra:Persona = new Persona();
//Le asigno a su propiedad nombre el valor "Sandra"
sandra.nombre = "Sandra";
//Le pido que hable; pasandole por parametro a su función "hablar" el
texto que dira
sandra.hablar("Mi nombre es " + sandra.nombre);
//Esto hara que nuestra Persona "sandra" diga "Mi nombre es Sandra"

En conclusión; abstracción es aislar todos los complejos metodos y propiedades de un objeto; tratando
de hacerlos mas simples y modulares cada vez.

Encapsulación
Hay muchos datos que no tiene porque conocerlo aquel que este usando la clase Persona; ya que son
inherentes al objeto y solo controlan su funcionamiento interno; por ejemplo, cuando alguien te ve
puede saber inmediatamente si eres hombre o mujer (propiedad) o puede hablarte y obtener una
respuesta procesada (metodo); tambien puede conocer el color de tu cabello y ojos. En cambio, jamas
sabra que cantidad de energia exacta tienes o cuantas neuronas te quedan, ni siquiera preguntandote ya
que ninguna de tus propiedades externas visibles o funciones de comunicación al publico te permiten
saber esos datos.

Esto es la encapsulación u ocultación; hacer las variables que son innecesarias para el tratamiento del
objeto pero necesarias para su funcionamiento privadas, asi como las funciones que no necesitan
interacción del usuario o que solo pueden ser llamadas por otras funciones dentro del objeto (Como por
ejemplo, palpitar)

La encapsulación es muy conveniente y nos permite (Si programamos bien) colocar en funcionamiento
nuestro objeto en cualquier tipo de sistema, de una manera modular y escalable (algunas de las reglas
de la ingenieria del software).

Herencia
Este quizas es el tema que mas problemas causa al estudiante; sin embargo, no es dificil en su
concepción.
El objeto Persona es un objeto muy generico y limitado en si; asi que se puede considerar como un
objeto Abstracto; ya que por si mismo no puede crear una persona completa; sin embargo, sus funciones
basicas son las mismas en todos los seres humanos, con diferencias puntuales, asi que podemos crear
dos objetos Hombre y Mujer, que hereden todas sus caracteristicas genericas como respirar, hablar,
nombre, etc, del objeto Persona, y sea en la implementación de cada objeto donde empiezen las
diferencias.

Si lo hago asi, sabre que tanto mis instancias (Ver nota abajo) del objeto Hombre como las del objeto
Mujer tendran el metodo respirar, hablar, etc; y la propiedad nombre, color de piel, color de cabello;
etc. Pero, por ejemplo, solo el objeto Mujer tendra el metodo "dar a luz" si yo se lo programo y solo el
objeto Hombre tendra el metodo "Fecundar".

Nota: Se le llama instancia a cada variable que tenga dentro de si un objeto de una clase especifica;
un ejemplo de instancia es el objeto "sandra" que declaramos en el codigo de arriba; solo son
consideradas instancias despues de que se les asigna memoria (Con la palabra clave new).

Todo esto es posible gracias a que el objeto Hombre y el objeto Mujer heredaron del objeto Persona
todas sus propiedades y metodos.

Aqui llega otro concepto que es el de objeto o Clase Abstracta; como es el objeto Persona, una clase
abstracta es una clase de la que no se pueden instanciar objetos; solamente puede heredar a otro
objeto sus propiedades y metodos, siendo el objeto heredado el que se instancie; en este caso, las
clases Hombre y Mujer son instanciables porque heredan de la clase Persona; pero Persona no puede ser
instanciada como un nuevo objeto, ya que al ser abstracta, el programador no se lo permite.

11
Programación orientada a objetos en ActionScript 2.0
Entremos en materia; vamos a ver ahora todas las caracteristicas anteriormente dichas aplicadas a
ActionScript 2.0; asi que empezaremos con algunos ejemplos sencillos de clases incluidas dentro de
Flash MX 2004 para ver como funciona.

Observando este codigo encontraras muchas de las propiedades que mencionamos anteriormente acerca
de los objetos; en los que son inherentes en Flash; para esto, vamos a suponer que tienes un campo de
texto llamado "area_txt" y un MovieClip llamado "pelicula_mc"; lee atentamente los comentarios del
codigo por favor:

//Iniciemos con una muestra de como se manejan las propiedades y

miembros dentro de Flash

/*Si conoces previamente cualquier lenguaje moderno veras que se rige

por una sintaxis del
tipo NOMBRE.VALOR o NOMBRE.FUNCION donde nombre es el nombre de
nuestro objeto; aqui en
Flash no es diferente :D*/

/*Para empezar, vamos a ver las PROPIEDADES, en este ejemplo, vamos a

modificar la propiedad
"text" de un campo de texto*/
area_txt.text = "Programación orientada a objetos";

/*Como puedes notar, las PROPIEDADES funcionan de la misma manera que

simples variables
Guardan un valor que tu puedes modificar */
/*Ahora veamos los METODOS, para esto, vamos a invocar al metodo
"gotoAndPlay" de un Movieclip */
pelicula_mc.gotoAndPlay(50);
/*Los METODOS se manejan de la misma manera que las funciones, en este
caso, esta tenia un parametro
"frame" cuyo valor pasamos como 50 */

/* Veamos la instanciación de objetos; vamos a crear un nuevo objeto

"Date" */
var fecha:Date = new Date();
/* Primero coloco la instrución para declarar "var" luego el nombre de
la variable, dos puntos y el
nombre de la clase de la que esta variable sera una instancia; por
ultimo por medio de "new" asigno
memoria, diciendole que cree dentro de si un objeto "Date"; usamos
el "()" como en las funciones para
invocar su constructor; un concepto que veremos mas adelante */

En este corto ejemplo solo usamos clases incluidas dentro de Flash, TextField (El campo de texto),
MovieClip y Date; ahora vamos a ver como se crean estas clases

1r Movimiento: Archivos externos .as, primera clase

Lo primero que debes tener en cuenta que cuando estes programando clases, estas DEBEN ir en archivos
externos .as; no pueden ser incluidas como parte del codigo dentro de la pelicula (Esto es muy
conveniente, asi el codigo se vuelve reusable para otros proyectos).

Mas adelante trataremos el tema de los paquetes de clases y los namespace; por el momento, solo
mantendremos los archivos .as en la misma carpeta de nuestro .fla y .swf.

Dentro de Flash, ve al menu File -> New (No vale CTRL+N) y en el cuadro de dialogo emergente elije
"Actionscript File"; aparecera ante nosotros una vista de solo codigo, sin escenario; que sera donde

12
podremos programar nuestra clase (Ahora claro, no es necesario hacer esto dentro del IDE de Flash;
podemos perfectamente hacerlo desde el Bloc de Notas, VI o cualquier editor de texto externo a Flash)

Aqui empezaremos, creando nuestra primera clase; la clase Persona.

Coloca este codigo dentro de Flash, en el modo anterior de "Actionscript File"

//Inicio declaración de la clase

class Persona {
//Variable nombre, miembro de la clase
var nombre:String;
//Función constructora; se llama asi porque se ejecutara en el
momento
//que se invoque la instrucción "new", es decir, cuando sea
creada una
//instancia de esta clase
function Persona() {
//El uso del apuntador "this" indica que nos estamos
refiriendo a los
//elementos de la clase; en este caso, modificaremos la
variable "nombre"
//mencionada arriba
this.nombre = "";
//Esto simplemente para avisar en la ventana del output
que la clase fue creada
trace("Una nueva Persona ha nacido");
}
}
Ahora guarden este archivo como "Persona.as" en una carpeta que usaremos para guardarlo todo; por el
momento
IMPORTANTE: El nombre del archivo .as que contenga el codigo de las clases no es trivial; siempre el
nombre del archivo debe ser el mismo nombre de la clase; por eso, en este caso, la clase se llama
"Persona" y el archivo "Persona.as".
Solamente puede ser declarada UNA clase por archivo, si vas a crear 7 clases, entonces necesitaras 7

archivos
Ahora, crea una nueva pelicula, guardala con cualquier nombre en la misma carpeta donde colocaste el
"Persona.as" y colocale este codigo en el primer keyFrame (Atención a los comentarios)
//Palabra clave que trae a nuestro codigo la clase que creamos; notese
que no he colocado la
//extensión ".as"
import Persona;
//Creo una nueva variable llamada "freddie" de tipo "Persona"
var freddie:Persona;
//Asigno memoria a la variable "freddie" y la convierto en una
instancia de la clase "Persona"
freddie = new Persona();

Prueba la pelicula con CONTROL+ENTER y notaras que en la ventana del Output aparecera el mensaje
"Una nueva Persona ha nacido", demostrandonos que se ejecuto la función "Persona" al momento de
contruirse el objeto; esto es a lo que se llaman "Constructores"

Asi hemos iniciado la programación orientada a objetos con nuestra primera clase; Persona

2o Movimiento: Miembros y Abstracción

Ahora definiremos los miembros de la clase; que no son mas que las funciones (metodos) y variables
(propiedades) que integraran a nuestra clase.

Si enumeramos funciones basicas de una persona; esta debe

13
 1. Hablar
2. Oir
3. Tocar
4. Mover

Y si hablamos de sus propiedades basicas

1. Nombre
2. Color de Ojos
3. Color de Piel

Se que dejo muchisimas por fuera; pero esto es en pro de hacer mas sencillo el ejemplo.
Asi que, las funciones basicas seran metodos de nuestra clase y las propiedades ... lo mismo.

Vamos a modificar de esta manera nuestro codigo

//Inicio declaración de la clase

class Persona {
/* PROPIEDADES */
//Variable nombre, miembro de la clase
var nombre:String;
var colorOjos:String;
var colorPiel:String;
//Función constructora; se llama asi porque se ejecutara en el
momento
//que se invoque la instrucción "new", es decir, cuando sea
creada una
//instancia de esta clase
function Persona() {
//El uso del apuntador "this" indica que nos estamos
refiriendo a los
//elementos de la clase; en este caso, modificaremos la
variable "nombre"
//mencionada arriba
this.nombre = "";
//Esto simplemente para avisar en la ventana del output
que la clase fue creada
trace("Una nueva Persona ha nacido");
}
/* METODOS */
//Metodo "hablar", recibe por parametro la frase que dira
//devuelve una frase procesada
function hablar(frase:String):String {
//La variable mensaje guardara "procesada" la frase que
se dira
var mensaje:String = this.nombre+" dice: "+frase;
//Esta frase aparecera en el Output
trace(mensaje);
//Y asi mismo, la función la retornara
return mensaje;
}
//Metodo "ver"
function ver():Void {
trace(this.nombre+" esta mirando alrededor");
}
//Metodo "tocar"; recibe por parametro, otra persona para tocar
function tocar(personaTocada:Persona):Void {
trace(this.nombre+" ha tocado a
"+personaTocada.nombre);
}
//Metodo "mover"; recibe por parametro el lugar a moverse

14
 function mover(lugar:String):Void {
trace(this.nombre+" se mueve a "+lugar);
}
}
Y empezemos a hacerlo divertido; hagamos que dos "Personas" interactuen; modifiquen el codigo de la
pelicula .FLA a esto:
//Trae a nuestro codigo la clase que creamos; notese que no he
colocado la extensión ".as"
import Persona;
//Creo una nueva variable llamada "freddie" de tipo "Persona"
var freddie:Persona;
//Asigno memoria a la variable "freddie" y la convierto en una
instancia de la clase "Persona"
freddie = new Persona();
//Creo otra persona
var sandra:Persona = new Persona();
//Les asigno nombres
freddie.nombre = "Freddie®";
sandra.nombre = "Shala";
//Empezamos a llamar a sus metodos :D
freddie.mover("donde esta la otra persona");
sandra.ver();
freddie.hablar("Hola, ¿como te llamas?");
sandra.hablar(sandra.nombre+" y tu?");
freddie.hablar("Yo soy "+freddie.nombre);
freddie.ver();
freddie.tocar(sandra);
sandra.hablar("Go to fuck");
freddie.hablar(":(");
Lo que mostrara la siguiente salida en la ventana del trace:
Una nueva Persona ha nacido
Una nueva Persona ha nacido
Freddie® se mueve a donde esta la otra persona
Shala esta mirando alrededor
Freddie® dice: Hola, ¿como te llamas?
Shala dice: Shala y tu?
Freddie® dice: Yo soy Freddie®
Freddie® esta mirando alrededor
Freddie® ha tocado a Shala
Shala dice: Go to fuck
Freddie® dice: :(
Bueno; aqui empiezo a ver que estas clases podrian ser utiles (aparte de por diversión) en algun tipo de
chat hecho en Flash; pero en esta ocasión seran simplemente creadas con motivos "Educativos".
Nota: Ninguna de las situaciones interpretadas en este tutorial pertenecen o se relacionan a la vida
real, ..

3r Movimiento: Encapsulación, getters y setters

En nuestro movimiento anterior; creamos propiedades y metodos "miembro" de la clase; como un color
de ojos, hablar, ver etc. Ahora vamos a encapsular todos estos datos; algo escencial en la programación.

Como menciona antes en la teoria; la encapsulación es necesaria para crear una verdadera
programación orientada a objetos.
La encapsulación nos permitira esconder del "mundo exterior" de la clase las variables y funciones
internas que no llamaremos desde una instancia. De hecho, la teoria dice que nosotros NO DEBEMOS
manipular directamente las propiedades (variables) de una clase; para ello usaremos un tipo de
funciones llamadas getters y setters.

Nota: Las funciones getters y setters son funciones que nos permiten manipular la asignación y llamado
de variables dentro de nuestro programa; como su nombre lo indica son funciones para asignar un dato
a una variable set, o para obtener el dato de una variable get. Una vez creadas, cada vez que

15
asignemos un dato a una variable sera llamada su función set y cuando pidamos el dato de una variable
veremos su get.

Asi que a la orden del dia tenemos

1. Hacer publicas las funciones o propiedades a las que accederemos desde el exterior
2. Hacer privadas las funciones o miembros que no queremos/debemos acceder desde el exterior
3. Crear funciones getter/setter para las propiedades que ahora son privadas y queremos
modificar

Manos a la obra; modifiquen el codigo de la clase asi:

//Inicio declaración de la clase

class Persona {
/* PROPIEDADES */
//Variable nombre, miembro de la clase
public var nombre:String;
private var colorOjos:String;
private var colorPiel:String;
//Función constructora; se llama asi porque se ejecutara en el
momento
//que se invoque la instrucción "new", es decir, cuando sea
creada una
//instancia de esta clase
function Persona() {
//El uso del apuntador "this" indica que nos estamos
refiriendo a los
//elementos de la clase; en este caso, modificaremos la
variable "nombre"
//mencionada arriba
this.nombre = "";
//Esto simplemente para avisar en la ventana del output
que la clase fue creada
trace("Una nueva Persona ha nacido");
}
/* METODOS */
//Metodo "hablar", recibe por parametro la frase que dira
//devuelve una frase procesada
public function hablar(frase:String):String {
//La variable mensaje guardara "procesada" la frase que
se dira
var mensaje:String = this.nombre+" dice: "+frase;
//Esta frase aparecera en el Output
trace(mensaje);
//Y asi mismo, la función la retornara
return mensaje;
}
//Metodo "ver"
public function ver():Void {
trace(this.nombre+" esta mirando alrededor");
}
//Metodo "tocar"; recibe por parametro, otra persona para tocar
public function tocar(personaTocada:Persona):Void {
trace(this.nombre+" ha tocado a
"+personaTocada.nombre);
}
//Metodo "mover"; recibe por parametro el lugar a moverse
public function mover(lugar:String):Void {
trace(this.nombre+" se mueve a "+lugar);
}
//GETTERS Y SETTERS

16
 //Funciones "get" y "set" para el color de ojos; funcionaran en
el codigo
//como una variable llamada "ojos" y sera llamado su set cada
vez que se
//le asigne algo; y su get cada vez que se solicite su valor
public function set ojos(color:String):Void {
trace(this.nombre+" tiene ojos de color "+color);
this.colorOjos = color;
}
public function get ojos():String {
return this.colorOjos;
}
//Funciones "get" y "set" para el color de piel
public function set piel(color:String):Void {
trace(this.nombre+" tiene piel "+color);
this.colorPiel = color;
}
public function get piel():String {
return this.colorPiel;
}
}

Como ven; he usado las palabras clave public y privatedel lenguaje ActionScript 2.0 para declarar
algunas funciones y variables publicas y otras privadas. Las privadas solo podran ser llamadas desde el
codigo dentro de la clase; mientras que las publicas se podran llamar desde cualquier lugar del codigo.

NOTA: toda función set debe asignarle algo a alguna variable miembro de la clase y toda función get
debe retornar algun valor

Para ver un poco mas la utilidad de lo que acabamos de hacer y hacer uso de los setters y getters vamos
a modificar y reescribir algunas partes del codigo en la pelicula .FLA:

//Trae a nuestro codigo la clase que creamos; notese que no he

colocado la extensión ".as"
import Persona;
//Creo una nueva variable llamada "freddie" de tipo "Persona"
var freddie:Persona;
//Asigno memoria a la variable "freddie" y la convierto en una
instancia de la clase "Persona"
freddie = new Persona();
//Creo otra persona
var sandra:Persona = new Persona();
//Les asigno nombres
freddie.nombre = "Freddie®";
sandra.nombre = "Shala";
//Les asigno color de ojos y piel
freddie.ojos = "negro";
sandra.ojos = "azul";
freddie.piel = "blanca";
sandra.piel = "morena";
//Empezamos a llamar a sus metodos :D
freddie.mover("donde esta la otra persona");
sandra.ver();
freddie.hablar("Hola, ¿como te llamas?");
sandra.hablar(sandra.nombre+" y tu?");
freddie.hablar("Yo soy "+freddie.nombre);
freddie.ver();
freddie.hablar("Me gustan tus ojos color "+sandra.ojos+" y tu piel
"+sandra.piel);
sandra.hablar("Gracias :D");
freddie.tocar(sandra);

17
sandra.hablar("...");
freddie.hablar("...");
Lo que nos dara tambien un cambio en la ventana del trace:
Una nueva Persona ha nacido
Una nueva Persona ha nacido
Freddie® tiene ojos de color negro
Shala tiene ojos de color azul
Freddie® tiene piel blanca
Shala tiene piel morena
Freddie® se mueve a donde esta la otra persona
Shala esta mirando alrededor
Freddie® dice: Hola, ¿como te llamas?
Shala dice: Shala y tu?
Freddie® dice: Yo soy Freddie®
Freddie® esta mirando alrededor
Freddie® dice: Me gustan tus ojos color azul y tu piel morena
Shala dice: Gracias :D
Freddie® ha tocado a Shala
Shala dice: ...
Freddie® dice: ...

4o movimiento: Clases abstractas, Herencia y super

Repasemos los objetos de la vida real; todos los que estan leyendo esto tienen en frente un computador
(O a los pies, no se); entonces tenemos la clase Computador de la que instanciamos objetos que son los
que usamos; todos los objetos de la clase Computador hacen mas o menos lo mismo; tienen metodos
para calcular, prender, apagar, escribir, borrar ... pero pensandolo bien; esas son las funciones generales
de la clase Computador, porque en si, la clase es una clase abstracta; tu no tienes un Computador como
el resto, tu Pc es especial, vamos a dividirlo en dos clases (Injusto, hay mas, pero estas son las mas
comunes); PC y Mac, asi, a los PC puedes instalarles Windows y Linux y puedes usar procesadores Intel,
Transmeta o AMD; esas son propiedades y metodos exclusivos de la clase "PC"; en los computadores que
sean instancias de la clase "Mac", puedes instalar el MacOsX o Linux tambien, usas procesadores
Motorola o PowerPC ... pero en ambos tienes las mismas funciones comunes de la clase Computador ...
¿como hacer que las igualdades prevalezcan y sin embargo podamos diferenciar una clase de la otra?; ah
facil, creamos dos clases que tengan un pedazo del mismo codigo y el resto distinto ... y si tenemos
5000 clases con cosas en comun y quiero cambiar un detalle de lo "comun", tendria que cambiarlo en las
5000 clases ... la solución !Herencia¡

Con Herencia, podemos hacer que Computador sea una clase abstracta (Entiendase por clase abstracta
una clase que no se puede instanciar, solo heredar) y crear dos nuevas clases, Mac y PC, que hereden de
Computador todas sus propiedades y metodos e implementen ellas mismas sus propios. ¿Por que es
importante que Computador sea una clase abstracta? Dado que Computador tiene los metodos y
propiedades genericos, pero no los especificos, si un programador crea una instancia de una clase
Computador aparte de que seria un poco inutil saltaria toda la teoria de la encapsulación del codigo

¿Y como hago lo que dicen las mil palabras de arriba en ActionScript?, bueno, implementemos las tres
clases; una clase "Computador", en un archivo Computador.as, una "PC" en PC.as y una Mac en un
archivo Mac.as; todas en la misma carpeta junto a un archivo FLA de cualquier nombre donde
instanciaremos los objetos; iniciemos con el archivo Computador.as

//Esta sera nuestra clase Computador, de la que heredaran las otras

dos
class Computador {
//Función constructora; este constructor se ejecutara primero
que el
//constructor de la clase heredada
function Computador() {
trace("Creado un nuevo computador");
}
//Todos los computadores prenden ¿no?
public function encender():Void {
trace("El computador esta iniciando");

18
 }
//Y todos se apagan ... en teoria
public function apagar():Void {
trace("El computador ha sido apagado");
}
}
Ahora el archivo PC.as
//La palabra clave "extends" es la que le indica a la clase que
//herede todas sus propiedades y metodos de una superclase, en
//este caso "Computador"
class PC extends Computador {
//Esta propiedad nos devolvera el sistema operativo
private var SO:String;
//Constructor del PC
function PC () {
trace("Has creado un PC");
}
//Función setter para colocar un sistema operativo
public function set sistema(SSOO:String):Void {
this.SO = SSOO;
}
//Función que me dira que sistema tengo instalado
public function sistemaInstalado(){
if(this.SO == "windows"){
trace("Tienes instalado Windows X_X");
} else if (this.SO == "linux"){
trace("Tienes instalado Linux ^_^");
} else {
trace("No se que tienes instalado O_o");
}
}
}
Luego nuestra clase Mac en Mac.as
//Aqui es lo mismo, solo que en la clase Mac
class Mac extends Computador {
//Constructor del PC
function Mac() {
trace("Has creado una Mac :-)");
}
//Como diferencia al PC, aqui instalamos Mac
public function instalarMac():Void {
trace("Has instalado MacOSX");
}
//Las Mac tienen "Rendezvous" que les permite configurarse
solas
//en cualquier entorno de red; demosle esa capacidad
public function rendezvous():Void {
trace("Detectando redes cercanas ...");
trace("Red configurada ^^");
}
//Y una funcioncilla para navegar con Safari alguna web
public function safari(URL:String):Void {
trace("Estas navegando "+URL);
}
}
Por ultimo, en el archivo FLA vamos a "jugar" creando una Mac y una PC, haciendo cosas que haces
ambas (por medio de la herencia de la clase Computador) y haciendo cosas que solo estan
implementadas y son exclusivas de cada clase
//Importo las clases PC y Mac, estsa al heredar de la clase Computador
//importan automaticamente la misma
import PC;
import Mac;

19
//Inciemos con el PC
trace("**** SUNNY *****");
//Le asigno memoria,
var Sunny:PC = new PC();
//Llamo a una función de la clase Computador que hereda la clase PC
Sunny.encender();
//Llamo a un setter miembro de la clase PC nada mas
Sunny.sistema = "linux";
//Llamo a un metodo propio de la clase PC
Sunny.sistemaInstalado();
//Llamo al metodo apagar, de la clase heredada Computador
Sunny.apagar();
/**/
//Sigamos con el Mac
trace("**** BLUESHOCK *****");
//Le asigno el tipo "Mac" y creo la instancia de la clase con new
var Blueshock:Mac = new Mac();
//Llamo a un metodo de la clase Computador, heredado a Mac, por ende
//aparece en la clase Mac y PC
Blueshock.encender();
//Llamo al metodo propio de Mac "instalarMac", este no aparece en la
//clase PC
Blueshock.instalarMac();
//Otro metodo miembro de la clase Mac
Blueshock.rendezvous();
//Llamo al metodo Apagar, heredado de "Computador"
Blueshock.apagar();
Al darle CONTROL+ENTER a nuestra pelicula encontraremos que el Output nos muestra el proceso,
donde se evidencia que cada vez que hacemos un new Mac() o un new PC() se ejecuta primero el
constructor de la clase Computador, y luego el de la clase que lo heredo; vean y analizenlo ustedes
mismos
**** SUNNY *****
Creado un nuevo computador
Has creado un PC
El computador esta iniciando
Tienes instalado Linux ^_^
El computador ha sido apagado
**** BLUESHOCK *****
Creado un nuevo computador
Has creado una Mac :-)
El computador esta iniciando
Has instalado MacOSX
Detectando redes cercanas ...
Red configurada ^^
El computador ha sido apagado

Asi de una manera sencilla hemos implementado herencia en nuestras clases de Flash.

Y bueno, como ya puedo verlos preguntandose ¿Y esto a mi de que me sirve aparte de complicarme la
vida?; vamos a analizar un ejemplo practico, los componentes de Flash MX 2004.
Estos componentes, como pueden ver, tienen similitudes muy comunes; por ejemplo, casi todos tienen
el evento change o click y en todos hace lo mismo y se implementa de la misma manera; todos tienen el
evento setStyle, que permite cambiar el estilo del componente y asi la mayoria tiene cosas similares
entre uno y otro; esto es porque todos los componentes heredan de una superclase llamada UIObject,
que contiene las propiedaes y metodos basicos para todos los componentes; asi no tenemos que duplicar
esfuerzos recreando cada propiedad o metodo comun, solo heredamos e incluimos las que marquen la
diferencia.

En entornos profesionales de desarrollo esto es extremadamente util, ya que si perteneces a un equipo

de programación y necesitas que X parte del proyecto este desarrollada antes de hacer la tuya, no es
necesario; digamos que estamos haciendo un videojuego y tu tienes encargada la función de hacer los
movimientos de los enemigos y otro compañero tuyo los movimientos del personaje principal; se puede

20
crear una superclase llamada Persona, que contenga las bases fisicas comunes entre el movimiento de
los enemigos y el de los personajes (Por ejemplo, la gravedad siempre es la misma) y despues de que se
pongan de acuerdo que metodos tendra una Persona en comun, cada uno se pone a desarrollar su parte
mientras otro termina la clase Persona.

Nota: Una SuperClase es el nombre comun que se le da a las clases abstractas o clases que son
heredadas por otras; en este ejemplo, las clases normales eran PC y Mac y la SuperClase era
Computador

5o Movimiento: Interfaces
Una interfaz basicamente es una declaración de propiedades y metodos de una clase sin codigo!!, es
decir, una clase que solo tiene los nombres, los tipos y los parametros de los metodos y las propiedades,
pero no las implementa; es muy util para pautar reglas en equipos de trabajo y algo similar a la herencia

Esta vez usaremos animales para nuestro ejemplo, un pato y un gato (No pregunten por que los escoji

); todos los animales comen, pero el gato come con el hocico y el pato con el pico, al ser procesos
de igual nombre pero distinto proceso, una interface que implemente el metodo comer y luego ellos
"implementen esa interface" y le pongan codigo respectivo seria lo ideal; asi mismo ambos caminan,
pero uno lo hacen con dos patas y otro lo hace con 4

Lo primero que haremos entonces sera crear la interface de Animal; asi que creen un archivo Animal.as
y coloquenle este codigo

//Declaramos nuestra interface "Animal"

interface Animal {
//Como ven, se declara la "comer", con un parametro
//"comida" de tipo "String" y es una función "Void" que no
retorna nada, pero
//No se coloca codigo alguno en la función, solo se declara
function comer(comida:String):Void;
function caminar(destino:String):Void;
}
Ahora creemos las clases que implementaran esa interface, iniciando por Gato.as
//La palabra clave "implements" es la que me permite asignarle una
interface
//a una clase
class Gato implements Animal {
//El constructor de toda la vida ;-)
function Gato() {
trace("miau");
}
//Ahora la implementación de las funciones de la interface
//Debe escribirse exactamente igual a como esta en la interface
public function comer(comida:String):Void {
trace("El gato, con su hocico esta comiendo "+comida);
}
//Igual la de caminar
public function caminar(destino:String):Void {
trace("El gato, camina en sus cuatro patas a
"+destino);
}
}
Pasemos a la clase Pato, en Pato.as
class Pato implements Animal {
//Lo mismo, un constructor para el pato
function Pato() {
trace("quack!");
}
//De nuevo implementamos los metodos descritos en la interface

21
 //Aqui con un codigo distinto
public function comer(comida:String):Void {
trace("El pato come "+comida+" usando su pico");
}
//Igual la de caminar
public function caminar(destino:String):Void {
trace("Hacia "+destino+" camino en dos patas el pato;
lol");
}
}
Para terminar como siempre, creamos un FLA en la misma carpeta de los .AS; que es donde crearemos
las variables y el codigo que le da utilidad a nuestras clases; en el colocamos (Primer keyFrame):
//Importo las clases Gato y Pato, que implementan la interface Animal
import Gato;
import Pato;
//Les asigno tipo de objeto y memoria
var garfield:Gato = new Gato();
var lucas:Pato = new Pato();
//Llamo a la función comer, declarada en la interface y escrita en la
clase
garfield.comer("lasaña");
//Igual con la de caminar
garfield.caminar("el sofa");
//Si notan, se llama igual, pero su codigo y función es diferente
lucas.comer("maiz");
lucas.caminar("el fin del mundo");
Y si le damos CONTROL+ENTER, podemos ver su comportamiento reflejado el el Output, las funciones
fueron implementadas con mismo nombre, tipo y argumentos, pero con distinto codigo que genera
resultados diferentes
miau
quack!
El gato, con su hocico esta comiendo lasaña
El gato, camina en sus cuatro patas a el sofa
El pato come maiz usando su pico
Hacia el fin del mundo camino en dos patas el pato; lol

Asi hemos implementado un sistema simple de interfaces entre dos clases.

Conclusiones
La programación orientada a objetos es un mundo increible de posibilidades sin fin, que no puede ser
cubierto en un solo tutorial y, por su naturaleza de composición mas artistica que cientifica, depende de
la experiencia y del programador la buena implementación de la misma.
Algunos temas que recomendaria consultaras por tu cuenta serian clases, propiedades y metodos
estaticos y paquetes; interesantes para el orden de una aplicación.
En Cristalab tenemos un ejemplo util del uso de Clases en ActionScript 2.0 y es la Galeria de fotos
clab_Gallery; un interesante proyecto de nuestra web que implementa muchos de los conceptos vistos
aqui :D, asi mismo, todos los componentes de Flash MX 2004 estan programados usando clases
intensivamente, asi como proyectos independientes de la web de Macromedia, como el software Breeze.

Espero sea muy util este tutorial en el proceso de aprendizaje de Actionscript 2.0; en caso de tener
cualquier duda o pregunta no dudes dirigirla a nuestros foros; si encuentras algun error en el tutorial por
favor avisame a webmaster@cristalab.com

22
 CREAR UN SONIDO PERMANENTE (LOOP) POR MEDIO DE
ACTIONSCRIPT

http://www.cristalab.com/tutoriales/23/crear-un-sonido-
permanente-loop--por-medio-de-actionscript

Un truco sencillo y muy útil a la hora de crear una web o una multimedia con sonido es dotarlo de
música ambiental de fondo; pero el primer reto, sobre todo cuando se usan escenas es que el sonido se
mantenga durante toda nuestra película; así que aquí mostrare los pasos a seguir para conseguir un
sonido de fondo continuo en nuestra web.

Importar un sonido
Obviamente, lo primero que debemos hacer es conseguir un sonido, mejor si es corto para que notemos
el reinicio del sonido cuando termine su primera pasada; es recomendable en estos casos es usar un loop
de sonido continuo; en FlashKit hay muchos disponibles para descargar.

Ahora debemos importar nuestro sonido a Flash, igual que si importáramos una imagen, con

CONTROL+R

buscaremos nuestro archivo de sonido y una vez elegido quedara guardado en la librería.

Como haremos el sonido infinito por medio de ActionScript, necesitamos

decirle al sonido que este disponible para ActionScript; así que en la librería,
damos click derecho sobre el icono del sonido y elegimos la opción Linkage
del menú; en el cuadro de dialogo emergente damos click a Export for
ActionScript y en donde dice Identifier escribiremos soni di ll o, que será el
nombre con el que ActionScript identificara nuestro sonido.
Así debe quedar el cuadro de dialogo antes de dar aceptar:

Imagen del cuadro de dialogo "Linkage Properties"

23
Colocando el código

Ahora vamos al primer KeyFrame de nuestra película y colocamos el siguiente código (Lee los
comentarios atentamente)

/* Esta es una variable que nos permitirá saber si ya iniciamos el código del loop
infinito para impedir repetición de loops */
if (noRepeat == undefined) {
//Aqui la declaramos para que no vuelva a ser "undefined" y este código se
ejecute
//una vez aunque la línea de tiempo vuelva a este KeyFrame
var noRepeat:Number;
noRepeat = 1;
//Creamos una nueva variable de tipo sonido
var sonido:Sound = new Sound();
//Le adjuntamos el sonido que declaramos en la librería como "sonidillo"
sonido.attachSound("sonidillo");
//Le decimos, que si el sonido ya se termino de ejecutar
sonido.onSoundComplete = function() {
//Vuelva a arrancarlo
this.start();
};
//Iniciamos el sonido
sonido.start();
}

Como ven es un código bastante sencillo; fácil de utilizar y muy practico a la hora de crear sonidos
ambientales rápidamente; no coloco ejemplos ni archivos para descargar a este tutorial para animarlos
a que ustedes mismos creen sus propios ejemplos y completen este tutorial, sencillo y útil

USO DE LA CLASE COLOR DE FLASH

http://www.cristalab.com/tutoriales/142/uso-de-la-clase-
color-de-flash
.En este tutorial explicaré de manera sencilla, el uso de la clase COLOR que está disponible desde flash
player 5. Desde el constructor hasta un pequeño script que nos permita hacer transiciones de un color a
otro con un easing sencillo, todo explicado a continuación.

El uso que le puedes dar a este tutorial va desde cambios de color a los fondos dinámicos o cambios de
color a cualquier objeto, botón, moviec, etc.

El método setTranform consta de un objeto (que lo creamos con el constructor new Object ) que es el
que nos permite dar las “coordenadas” de color que queremos dar, este objeto consta a su vez de las
propiedades ra, rb, ga, gb, ba, bb, aa, ab.

Estas propiedades nos darán el valor de desplazamiento para los colores (R) rojo, (G) verde, (B) azul y
la transparencia (A) alfa. Cada propiedad del objeto funciona de esta manera:

• ra es el porcentaje del componente rojo (de -100 a 100).

• rb es el desplazamiento del componente rojo (de -255 a 255).

24
 • ga es el porcentaje del componente verde (de -100 a 100).
• gb es el desplazamiento del componente verde (de -255 a 255).
• ba es el porcentaje del componente azul (de -100 a 100).
• bb es el desplazamiento del componente azul (de -255 a 255).
• aa es el porcentaje de transparencia alfa (de -100 a 100).
• ab es el desplazamiento de transparencia alfa (de -255 a 255).

Para este tutorial no nos meteremos con los porcentajes de los componentes (ra, ga, ba y aa), solo
jugaremos con los desplazamientos de 0 a 255 así la propiedad nos deje un intervalo (-255 a 255).

Empecemos con algo sencillo, podemos ver simplemente que la clase color funcione y aprendamos (para
los más principiantes) a crear el objeto del método setTranform():

Así que primero crearemos una nueva Movie Clip en el escenario, bueno los más avanzados pueden
crearlo por AS, yo comenzaré por lo más sencillo, y el nombre que le daremos será “mc1”. Puede ser un
cuadro de color negro o la figura que ustedes quieran, pero que el nombre de instancia sea este “mc1” y
que sea negro para notar el script.

Luego en nuestro primer frame pondremos este codigo:

//Creamos el constructor para la clase color

mycolor = new Color(this.mc1);
//Creamos el famoso objeto
coltransf = new Object();
//Le damos valores a las propiedades del objeto
coltransf = {ra:ra, rb:50, ga:ga, gb:40, ba:ba, bb:255, aa:aa,
ab:255};
//y taraaaaaaaaan, damos la orden que aplique los cambios
mycolor.setTransform(coltransf);

Así exportamos a swf y la película nos debe mostrar un cuadro, circulo, bueno lo que ustedes hayan
hecho, de un color azul. Si es así vamos bien. Si sale negro deben mirar si copiaron bien el código o
también esta ahí el archivo de nivel 1.

25
En este momento tenemos claro como funciona la clase Color para darle vía código propiedades de color
y alfa a un objeto. Ahora pasaremos a algo un poco más complejo:

Con una función haremos que al pasar el Mouse por encima de un objeto este cambie de color y al pasar
fuera vuelva a otro estado. Digamos un simple rollOver y rollOut.

Para esto tendremos este código en el primer frame:

//Creamos el objeto que no tiene que ser creado para cada instancia
objeto_color = new Object();
//creamos la funcion que le dara color al objeto
function colorIn(mc) {
//Creamos el constructor para la clase color
mycolor = new Color(mc);
//Le damos valores a las propiedades del objeto
objeto_color = {ra:ra, rb:50, ga:ga, gb:40, ba:ba, bb:255,
aa:aa, ab:255};
//y aplicamos
mycolor.setTransform(objeto_color);
}
//y creamos la funcion que le dara color cuando se haya pasado fuera

function colorOut(mc) {
//Le damos valores a las propiedades del objeto para que vuelva
a ser NEGRO
objeto_color = {ra:ra, rb:0, ga:ga, gb:0, ba:ba, bb:0, aa:aa,
ab:255};
//y damos la orden que aplique los cambios de vuelta
mycolor.setTransform(objeto_color);
}

Luego podemos copiar tantos objetos como queramos, teniendo en cuenta de nombrar cada instancia
diferente, ejemplo: mc1, mc2, mc3, mc4, etc... y para cada instancia del objeto le asignaremos el
siguiente script que llamará las funciones:

on (rollOver) {
_root.colorIn.call(this, this);
}
on (rollOut){
_root.colorOut.call(this, this);
}

El resultado es un cambio de color con rollovers para cada instancia de objeto al que le hayamos puesto
el script anterior, ustedes pueden probar cambiando los valores de las funciones y viendo el resultado…
Creo que hasta acá la dificultad es normal. (ver archivo nivel 2.fla).

Ejemplo: Color Dinamico Nivel 2

Nota: el ejemplo fue ligeramente modificado en ancho y altura, para mostrarlo en el tutorial, en
los archivos del tutorial se encuentra el original del autor.

Ahora sí a lo que vinimos, cambios de color dinámicos con “easing”. Lo que haremos es el mismo efecto
anterior con un script mejorado un poco más complejo que dará como resultado el manejo del color
azul con easing, sí! solo el color azul, depende de sus comentarios y peticiones para hacerlo con todos
los colores y el alfa… Además un poco más de tiempo, ya explicaré al final por qué.

26
Este es el código para el primer frame:

/*creamos la funcion *color* indicando las propiedades para cada

instancia, asi creara un nuevo color con la propiedad *mycolor*,
un nuevo objeto con la propiedad *obj* y lo mas importante la
propiedad de color azul que sera *bb*/
function color(mc, mycolor, obj, bb, bf) {
//Creamos el constructor para la clase color
mycolor = new Color (mc);
//creamos el objeto para cada instancia
obj = new Object();
//establecemos el valor incial del azul en 0
bb = 0;
//establecemos la velocidad usada para el easing in y out
vel = 20;
//establecemos el valor final que queremos dar al azul
bf = 255;
/*creamos un controlador de evento que evaluara el valor del
color
y le asignara el valor de la velocidad por cada frame hasta que
llegue
al valor final del azul que queremos*/
mc.onEnterFrame = function() {
if (bb<bf) {
bb += vel;
obj = {ra:ra, rb:50, ga:ga, gb:40, ba:ba,
bb:bb, aa:aa, ab:255};
mycolor.setTransform(obj);
//cortamos el evento cuando se llegue al valor
final
} else if (bb == bf) {
delete mc.onEnterFrame;
}
};
//y creamos otro controlador de eventos para cuando se haga el
rollout
mc.onRollOut = function() {
mc.onEnterFrame = function() {
if (bb>0) {
bb -= vel;
obj = {ra:ra, rb:50, ga:ga, gb:40,
ba:ba, bb:bb, aa:aa, ab:255};
mycolor.setTransform(obj);
} else if (bb == 0) {
delete mc.onEnterFrame;
}
};
};
}

Y para cada instancia a la que queramos darle el efecto solo basta con ponerle este script.

on (rollOver) {
_root.color.call(this, this);
}

Y listo… Espero que les guste y más que todo que les ayude con sus proyectos. Este último script está,
obviamente, en el archivo de Nivel 3.fla

27
 USAR CSS EN FLASH

http://www.cristalab.com/tutoriales/192/usar-css-en-flash
Cuantas veces hemos querido poder cambiar el diseño visual de mi desarrollo en Flash, sin tener que
cambiar los componentes uno a uno. Un trabajo tedioso y que definitivamente nos quitaría mucho
tiempo.

El propósito de este manual es que podamos controlar la apariencia grafica de nuestro sitio hecho en
flash editando tan solo un archivo CSS. Para este manual recomiendo tener un conocimiento mínimo de
lo que son las hojas de estilo CSS, si no sabes de lo que te estoy hablando te dejo un pequeño tutorial
de css basico.

Supongamos que tienes diferentes textbox en tu sitio web y decides que ya no te gusta la fuente,
tamaño o el color que le pusiste. Si esto pasa y tienes hechos unos 10 campos de texto ¿Imaginas
cambiar uno a uno manualmente? Pues eso ya es cosa del pasado.

Flash nos permite agregarle propiedades a todos nuestros campos de textos usando CSS, permitiendo así
cambiar la apariencia grafica de nuestro sitio sin grandes esfuerzos. Y esto es posible ya que Flash
también contiene propiedades muy parecidas a las del CSS de XHTML. Para darte una idea mencionaré
algunas:

Propiedad de Propiedad de
Uso y valores soportados
CSS Actionscript
text-align textAlign Reconoce los valores de izquierda, derecha y centrado.
Solo la parte numérica del valor es usado, expresado en px o
font-size fontSize
pt.
text-
textDecoration Reconoce los valores none y underline.
decoration
Solo la parte numérica del valor es usado. Expresado en
margin-left marginLeft pixeles o puntos (px, pt). Y pone un margen en el lado
izquierdo.
Solo la parte numérica del valor es usado. Expresado en
margin-right marginRight pixeles o puntos (px, pt). Y pone un margen en el lado
derecho.
font-weight fontWeight Reconoce valores normal y bold.
font-style fontStyle Reconoce valores normal e italic.
Solo acepta valores hexadecimales o algunos nombres de
color color
colores en ingles, como red, black, yellow.

Necesitamos una forma de decirle a nuestro textbox como ajustar su formato o una parte de nuestro
texto. Las propiedades de las hojas de estilo CSS no son buenas para esto, es por eso que necesitamos
usarlas en conjunción con etiquetas HTML (Hipertext Markup Lenguague).

En la siguiente tabla muestro unas etiquetas que Flash soporta desde la versión MX 2004 y posteriores:

Nombre de Estilo
p
body
li
a
a:link
a:hover
a:active

28
Estas son algunas etiquetas de las tantas que soporta Flash MX 2004, solo por mencionar algunas.

Descripción del uso de hoja de estilos CSS.

Ahora haremos nuestra hoja de estilos CSS como un archivo de texto. En mi caso usaré Dreamweaver
para crearla. Las formas de definir nuestro estilo son variadas y depende de lo que queramos hacer, un
ejemplo sería lo siguiente:

p {
font-family: Arial,Helvetica,sans-serif;
font-size: 11px;
color: #0000FF;
}

En el código anterior definimos un estilo para todas las etiquetas <p>

Por ejemplo: si escribimos <p>Hola Mundo</p>, el texto que está entre la etiquetas <p></p>, tomará
las propiedades del estilo que definimos, que serían: tipo de fuente Arial, tamaño de la fuente de 11
pixeles y color #0000FF (rojo).

Podemos hacer estilos tipo clase que pueden ser aplicadas a elementos HTML específicos usando las
etiquetas <p> o <span> (cabe aclarar que no son clases de ActionScript).

Las clases CSS se inician con un punto, puede ser el que queramos, pero recomiendo que sea un nombre
alusivo al elemento al que queremos modificar, por ejemplo, si queremos definir las propiedades de los
títulos, un nombre candidato para la clase sería:

.titulo{
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
color: #FF0000;
}

Ya que tenemos la clase hecha, se la aplicaremos a la etiqueta <span> de esta forma:

<span class='titulo'>Este es mi titulo 1</span>

El nombre de la clase entre comillas va escrito sin el punto, este solo se usa para definir a la clase.

La etiqueta <p> se usa de la siguiente manera:

<p class='titulo'>Este es el titulo</p>

Creando nuestra hoja de estilo CSS

Ahora vamos a crear nuestro archivo CSS para usarlo en Flash. Los pasos a seguir seran los siguientes:

• Crear un objeto CSS.

• Agregar el estilo CSS
• Asignar el objeto de la hoja de estilo a un campo de texto que contenga el texto HTML.

29
 Nota: Cuando asignamos un CSS a un campo de texto, ocurren cambios a su comportamiento
normal, unos de esos cambios son que se convierte en un campo de texto de solo lectura y
no puede ser editado por el usuario.

Ahora si creamos nuestra hoja de estilos y lo guardamos con el nombre que gustes en mi caso lo llamare
“miCSS.css”:

p {
color: #000000;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
display: inline;
}

a:link {
color: #FF00FF;
text-decoration: underline;
}

a:hover{
color: #999999;
text-decoration: none;
}

.titulo {
color: #0000FF;
font-family: Arial,Helvetica,sans-serif;
font-size: 18px;
font-weight: bold;
display: block;
}

.concepto {
color: #666600;
font-style: italic;
font-weight: bold;
display: inline;
}

Creando la película Flash

30
Los pasos a seguir son:

1. Abrir un nuevo documento de Flash

2. Creamos un campo de texto sobre la escena.
3. Al campo de texto le modificamos la propiedades: texto dinámico, multilínea y seleccionar la
opción generar texto como HTML. Como se ve en la siguiente imagen.

4. Toma una instancia del campo de texto y llámalo mi_texto.

5. Abrimos el panel de acciones, podemos abrirlo presionando la tecla F9. En el primer fotograma
de la línea de tiempo agregamos el siguiente código en el panel de acciones, que ya abrimos
anteriormente

//Creamos un nuevo objeto de hoja de estilo

var myCSS = new TextField.StyleSheet();
//Especificamos la localización del archivo CSS, que creamos.
var cssURL = "miCSS.css";
//Escribimos el texto que queremos mostrar
//pero como lo escribiriamos en HTML

ejemploTexto = "<p class='titulo'>Css en Flash MX 2004 </p>";

ejemploTexto += "<p><span class='concepto'>Hojas de estilo Css:
</span>";
ejemploTexto += "Determinan el estilo y el formato de los elementos
a los que se aplican";
ejemploTexto += "como textos, imagenes, etc.";

31
 ejemploTexto += "Los links tambien se pueden personalizar ";
ejemploTexto += "<a href='http://www.cristalab.com'>Cristalab</a> ";
ejemploTexto += "Este ejemplo funciona de la misma manera en Flash
8.</p>";

//Cargamos el archivo CSS

myCSS.load(cssURL);
//Definimos el manejador onLoad
myCSS.onLoad = function(exito) {
if (exito) {
/*Si el el archivo CSS se cargo sin ningun error lo asignamos al
objeto texto "miTexto" y asignamos el texto en HTML
al campo de texto "miTexto.text" */
mi_texto.styleSheet = myCSS;
mi_texto.text = ejemploTexto; //Puede ser un texto html"
}
};

En el codigo anterior creamos un nuevo objeto de hoja de estilo (es importante hacer notar que
StyleSheet(); es una clase, mientras que styleSheet ( con ‘s’ minúscula inicial) que usamos en la parte
miTexto.styleSheet es una propiedad.)

Una vez hecho lo anterior usamos el método ‘load’ para cargar nuestro archivo CSS, “miCSS.css” y
usamos el método ‘onLoad’ para comprobar si se ha cargado correctamente, si es así entonces
asociamos la hoja de estilo al campo de texto antes de asignar nuestro texto al campo de texto.

Guardamos la película como EjemploCSS.fla en la misma carpeta donde hayamos guardado nuestra hoja
de estilos CSS, ejecuta la película con ctrl + Enter, para probar que funcione.

Esto es lo que tienes que ver:

Puedes cambiar las propiedades en tu hoja de estilos, como tamaño de fuente, colores, etc. Para hacer
pruebas y ver que con solo cambiar unas cuantas líneas de código obtenemos lo que queremos en los
elementos que lo aplicamos.

Este ejemplo funciona muy bien en Flash 8.

32
 MOVIMIENTO DE UNA BANDERA DINÁMICAMENTE POR
ACTIONSCRIPT

http://www.cristalab.com/tutoriales/70/movimiento-de-una-
bandera-dinamicamente-por-actionscript
Antes que nada hay que aclarar que este ejemplo solo sirve para flash mx, y no así para mx 2004, así
que no renieguen.

El efecto de bandera en movimiento necesita solo un layer o capa y un solo fotograma donde va la
acción.
Para empezar, importemos la imagen (que no tiene porque ser únicamente una bandera) al escenario
(no a la biblioteca). También podemos optar por dibujar nuestra propia bandera en flash.

Luego importemos la imagen o nuestra propia creación a la biblioteca (simplemente arrastrándola), al

hacer esto, flash nos preguntará en que la queremos converir. Elegimos la opción de clip de película o
movie clip, le ponemos el nombre “foto” y el registro en la esquina superior izquierda

Una vez que la imagen está dentro de la biblioteca con su respectivo nombre de instancia”foto”, le
damos click derecho y accedemos al menú “vinculación”. Ahí marcamos la opción de “exportar para
Action Script” y automáticamente se marca la opción “exportar en el primer fotograma”.

Luego de esto, volvemos a nuestro escenario y borramos la imagen que habíamos importado (ya que, ya
está dentro de la biblioteca como un MC).

Marcamos el primer fotograma clave de nuestro único layer y abrimos el panel de acciones.
Dentro pegamos este código:

interacciones = 30;
xo = 40;
yo = 30;
for (var i = 0; i<interacciones; i++) {
mc = attachMovie("foto", "foto"+i, 10+i*10, {_x:xo});
ancho = mc._width;
alto = mc._height;
uni = ancho/interacciones;
duplicate = _root.createEmptyMovieClip("mc"+i, 2000+i*100);
duplicate.lineStyle(0);
duplicate.beginFill(0, 100);
duplicate.moveTo(0, 0);

33
 duplicate.lineTo(0, alto);
duplicate.lineTo(uni, alto);
duplicate.lineTo(uni, 0);
duplicate.lineTo(0, 0);
duplicate._x = xo+i*uni;
mc.setMask(duplicate);
}
this.onEnterFrame = function() {
for (var i = 0; i<interacciones; i++) {
this["mc"+i]._y = this["foto"+i]._y=yo+5*Math.sin(a +=
0.2);
}
};
Sin mas ni menos, probamos nuestra película con Crl+enter.
Es muy probable, como me ocurrió a mí en principio, que solo se les vea una parte de la imagen o
bandera que flamea. La solución a esto es modificar el valor de las variables “X” e “Y” dentro del
código que pusimos en el panel de acciones.

Si siguieron los pasos correctamente, su imagen o bandera debería estar flameando perfectamente.
El secreto para que no aparezcan líneas blancas en la imagen es crear la imagen al tamaño que la van a
usar, y luego meterla en la biblioteca ya que el Script utiliza una variable llamada SetMask() y si se
modifica el tamaño luego, aparecen unas no muy estéticas líneas en la bandera o imagen.

CREAR SCROLLBAR MÁS EFECTO DE EASING

http://www.cristalab.com/tutoriales/135/crear-scrollbar-
mas-efecto-de-easing
Muchas veces al visitar otros sitios y al usar un scroll de estos sitios, uno ve el efecto de easing en el
scroll y nos da una sensación a suavidad muy buena, es agradable que las cosas "scrolleen" con ese
suavizado tan particular, bueno asi que me puse mano a la obra para poder tener el mio, pero quise
hacerlo de tal manera de que lo pueda reutilizar SIEMPRE, que ejecute una función determinada en
cualquier nivel de mi película.

34
Para lograrlo a esta función debemos de pasarle un par de parámetros, veamos...

Primero vamos a hacer un include de un ActionScript (este archivo es necesario para que funcione el
scroll porque tiene todo el código necesario), se lo pueden bajar de aquí y ponen ese archivo en la
misma carpeta del .FLA.
Hacemos por única vez un INCLUDE en nuestro fla en el _ROOT

#include "scroll_easyn.as"

Luego en nuestro fla cada vez que quisieramos generar éste scroll solo vamos a convocar a una función
que se encuentra dentro del archivo que incluimos ... de ésta manera:

_root.generarScrollEasyn(nivel, clip, anchoScroll, suavizado);

Bueno la función requiere un par de parámetros:

nivel: Es en donde vamos a generar el scroll por ejemplo: "_root.", _root.mcCont, etc.

clip: Este parametro es la ruta del CLIP CONTENEDOR, o sea el nombre de instancia del clip en donde
dentro del que tenemos nuestro contenido que queremos scrollar. (Es importante que en nivel, y clip
quede algo como por ejemplo: Nivel: "_root.mc" Clip: "_root.mc.contenedor")

anchoScroll: Es un valor numérico en el cual le seteamos el ancho que va a tener la barrita de scroll, si
el valor es menor a 3, el valor va a ser por default 3.

Suavizado (Opcional) Valor numérico en donde seteamos la velocidad del suavizado cuando frenamos el
scroll, si obviamos éste parámetro el valor por default es 10.

Bueno eso es todo pueden ver una prueba, acá de como funciona.
Los sources se los pueden descargar desde aquí.

Entonces cada vez que quisieramos usar el scroll solo escribimos ésto:

var nivel = _root.mc

var clip = _root.mc.contenedor
var anchoScroll= 8
var suavizado = 3
_root.generarScrollEasyn(nivel, clip, anchoScroll, suavizado );

O bien directamente:

_root.generarScrollEasyn(_root.mc, _root.mc.contenedor, 8, 3);

El scroll funciona tanto para texto, enmascarado con "SETMASK" o bien para texto e imágenes.

35
36