Actionscript

El ABC de Action Script 2.0 Fernando Proao Mayo 2015 1

ESCUELA SUPERIOR POLITECNICA DE CHIMBORAZO FACULTAD DE INFORMATICA Y ELECTRONICA

ESCUELA DE INGENIERIA EN SISTEMAS

EL A-B-C DE ACTIONSCRIPT PARA FLASH CS-6

Por Fernando Proao,

Mayo 2015

1.- CONCEPTOS GENERALES

El lenguaje de programacin standard en el programa de animacin Flash CS-6 es el

ACTIONSCRIPT 2.0 y su nueva versin 3.0.Este lenguaje permite un mejor y ms

complejo control de las animaciones de los objetos creados en el escenario de Flash.

La programacin es basada en el modelo OO (Orientado a Objetos). Los programas se

crean en base a comandos los mismos que pueden contener uno o ms parmetros los

mismos que pueden ser fcilmente aadidos de listas.

En esta gua revisaremos nicamente a versin 2.0 (AS2.0) el mismo que es basado en

el standard internacional , el ECMA-262 creado por un grupo europeo conocido como la

ECMA (European Computer Manufactures Association). Este estndar ha permitido que

los programadores de JavaScript puedan fcilmente utilizar el lenguaje de Flash y

viceversa.

Este lenguaje, al ser basado en la teora de lenguajes OO, se utilizar el concepto de

objetos, propiedades y acciones. Por ejemplo un botn, es un objeto que tiene propiedades (color, forma, valor textual, otros), y funciona de alguna manera al ser

activado con un click del mouse.

2.- CONCEPTO DE OBJETO Y CLASES

Un Objeto es un tipo de datos como un sonido, grafico, texto, valore numrico que usted

crea en Flash . Varios objetos comunes pueden pertenecer a una coleccin de objetos

llamado clase. Por ejemplo hay tres grficos: un cuadrado, rectngulo, circulo que se las puede

distinguir por su nombre. Todas las tres pertenecen a una clase llamada figuras

geomtricas.

En Flash se utilizara el concepto de instancia para describir un determinado objeto que pertenece a una clase.

En Flash se dira: hay tres instancias (cuadrado, rectngulo, crculo) de la clase figuras

geomtricas.

Cada objeto de una clase no solo se diferencias por su nombre sino por sus

caractersticas que son las propiedades. Cada objeto a su vez puede realizar cosas, como moverse, saltar, estas acciones se

llaman mtodos.


Estos conceptos se los puede recordar tratando las partes de una oracin, como: Los

objetos son nombres, las propiedades son los adjetivos y los mtodos son los verbos.

Entender la relacin entre los objetos, clases, propiedades y mtodos es muy importante

a la hora de programar con ActionScript. La clave ser el identificar adecuadamente las propiedades y los mtodos de las diferentes clases.

OBJETOS: Cuadrado, Rectngulo, Circulo

CLASE: {Figuras Geomtricas}

PROPIEDADES: Tamao, Posicin, Color Fondo, Color contorno

METODOS: Mover, borrar, copiar, reducir, otros

Los mtodos muchas veces se las asocia con las FUNCIONES

3.- NOMENCLATURA DE ACTIONSCRIPT 3.1.- USO DEL PUNTO .

Flash utilizar la nomenclatura del ., para reunir en una sola instruccin las clases, propiedades y mtodos.

Por ejemplo:

Profesor.edad = 48 (Se asigna a la edad del profesor el valor de 48)

Juan. carro.color = rojo (Se asigna el valor rojo al carro de Juan)

La nomenclatura . permite organizar los elementos en jerarqua de izquierda a derecha. Se podra leer la ultima instruccin as: Rojo es el color del carro de Juan.

Victor.salta( ) indica que hay un mtodo salta, el mismo que se

asigna al objeto Victor.

Los () indican que salta es un mtodo y no una propiedad.

Los mtodos muchas veces pueden tener a su vez, parmetros o argumentos los cuales irn dentro de los parntesis. Por ejemplo:

Victor.salta(bajo)

Luis.salta(alto)

La instruccin: gotoAndPlay(Escena 1, 7) indica que existe un mtodo gotoAndPlay con parmetros: Escena1 y el valor 7, que se traduce en vaya y ejecute el escenario 1 desde el fotograma 7.


3.2.- USO DEL PUNTO Y COMA ;

El punto y como sirve para indicar la finalizacin de una instruccin y el comienzo de

otra. Se puede utilizar la metfora de prrafo. Primero va una oracin, luego una pausa

(punto y como) y luego la otra oracin.

StopAllSounds() ; Primero se cancela todos los sonidos y luego el

gotoAndPlay(20) ; control sigue desde el fotograma 20

3.3.- LLAVES { }

Las llaves sirven para crear bloques de instrucciones. Como en todo lenguaje de

programacin orientado a objetos, se debe tener cuidado de organizar las llaves abiertas con las cerradas no solo en nmero pero en asociacin de bloques.

Ejemplo 1: Un bloque de instrucciones cerradas por { }. Las dos instrucciones dentro de las {} se

ejecutan en secuencia de arriba hacia abajo.

on(press) { stopAllSounds ( ) ;

gotoAndPlay (Menu,1); }

3.4.- COMAS ,

Las comas se usan para separar tems como parmetros, de un mtodo. Los parmetros

pueden ser 2, 3 4 o ms y la coma permite identificar cada uno de ellos.

gotoAndPlay(Fin, 1) Los dos argumentos del mtodo son separados por la coma.

3.5.- COMENTARIOS

En ActionScript, el uso de dos flash // permite crear comentarios // programa para navegar por botones

4.- USANDO OBJETOS

4.1. CONCEPTOS BASICOS

Los objetos son los primeros elementos bsicos de la Programacin Orientada a Objetos

(POO), la misma que es el estndar de la programacin moderna. El concepto de un

objeto es una instancia que puede tener atributos (propiedades), y puede realizar determinadas funciones (mtodos). Un objeto puede ser considerado tambin como:

- una variable: que le damos un valor inicial y que puede cambiar durante la

ejecucin del programa

- es una clase, que pertenece a un grupo especial (superclase)

Todo objeto en la POO tiene propiedades especiales que son definidas como:


1.- ABSTRACCION

2.- ENCAPSULACION

3.- POLIMORFISMO

4.- HERENCIA

4.2. ABSTRACCION

Es la manera como representamos un objeto tomando en cuenta nicamente las

caractersticas principales del elemento de la vida real. Por ejemplo la abstraccin del

objeto persona, es aislar todos los mtodos complejos y funciones de la persona y emitir solo los mas simples y tiles para la representacin de esa instancia.

4.3.ENCAPSULACION

Es la propiedad de un objeto que permite ocultar ciertas propiedades del objeto que no son necesarias presentarlas para la programacin. Nos permite utilizar los objetos de una

manera ms fcil, de una manera modular y escalable.

4.4. POLIMORFISMO

Es la propiedad de los objetos de tomar varias propiedades a la vez y presentar las

necesarias en las porciones del programa donde sea necesario

4.5. HERENCIA

Es la propiedad principal de la teora OO, donde un objeto puede heredar propiedades de otros objetos de los que pertenece, de esta manera se implementan objetos con

propiedades ya establecidas por los padres.

4.6. CREANDO OBJETOS

La creacin de objetos se realiza mediante el uso de variables en el programa

ActionScript 2.0 de Flash MX.

Ejemplo 2

// creacin de un nuevo objeto de la funcin Date()

var fecha: Date = new Date();

// creacin de un objeto de la clase Humano()

Luis = new Humano();

// creacin de un objeto micolor de la clase Color ();

micolor = new Color();

// inicio de una variable que maneja propiedades

mensaje_txt.txt = Introduccin a la POO;

// uso de una clase con un mtodo

animacin_cp.gotoAndPlay(10);


5.- ELEMENTOS BASICOS DE ACTIONSCRIPT

Todo programa de ActionScript tiene diferentes elementos los mismos que por su

funcionamiento y utilizacin dentro del programa se clasifican en:

5.1.- ACCIONES

Las acciones son un conjunto integrado de comandos que permiten ejecutar una

determinado accin luego de que suceda un evento dado por el usuario o por otra

porcin del mismo programa.

Por ejemplo la accin:

gotoAndPlay(3) ; indica que el control de Flash se mueva (goto) al fotograma numero 3 y (And) ejecute lo

que hay en ese fotograma (Play)

Para acceder al editor de ActionScript puede hacer una de las siguientes:

(a) Ir al men Ventanas >> Abrir Paneles >> Acciones; o

(b) Presionar F9; o

(c) Abrir la ventana inferior: Acciones - Fotograma

Ejemplo 3: Crear un ciclo de animacin, que al llegar al ltimo fotograma vuelva al fotograma

numero 15.

PASOS:

1.- Crear una capa: Animacin

2.- Realizar una interpolacin de movimiento desde el fot. #1 al Fot. 30

3.- Seleccionar el ltimo fotograma

4.- Abrir el editor de Acciones con F9

5.- Escribir el siguiente Script: gotoAndPlay(15);

6.- Ejecutar el ciclo con

NOTA: En la lnea de tiempo en el ltimo fotograma aparece una pequea letra a que indica que existe

ah un Script.

Fig. 1. Lnea de tiempo con la seal de un script

5.2.- EVENTOS

Los Eventos son acciones determinadas de Flash que responden a una activacin de un determinado objeto. Es el resultado de ejecutar un objeto de control.

Por ejemplo al disear botones en Flash, este objeto reaccionara a diferentes eventos

que estn asignados automticamente por Flash, los mismos que son:

Evento Reposo (no hay activacin del mouse);

Evento Sobre (el cursor esta sobre el botn)

Evento Presionado (se presiona con el mouse, el standard es el botn izquierdo)


Evento Zona Activa (se acerca el cursor al objeto o una zona aledaa)

El evento permite que el objeto por si solo acte de una manera u otra, sin que el programador tenga que escribir cdigo para estos eventos. Esta caracterstica hace

potente y gil la programacin.

Existen tambin un set de Eventos asignados al mouse que son:

on(press) : se ejecuta una accin al presionar el botn izquierdo del mouse.

on(release): se ejecuta una accin al liberar el botn izq. del mouse.

on(releaseOutside): ejecuta una accin cuando se hace click dentro del botn, se

mantiene presionado y se mueve el cursor fuera del rea activa del botn

on(rollOver): se ejecuta una accin cuando el puntero del mouse se encuentra dentro de

la zona activa.

on(rollOut): se ejecuta una accin cuando el puntero del mouse se encuentra fuera del

rea activa del botn.

on(dragOver) : se ejecuta la accin cuando se hace click y se mantiene pulsado el botn

y se mueve el puntero del mouse fuera de la zona activa y vuelve sobre la zona activa

del botn.

on(dragOut): se ejecuta la accin cuando se hace click se mantiene pulsado el botn y

se mueve el puntero fuera de la zona activa del botn.

5.3.- FUNCIONES

Las funciones son grupos e instrucciones de ActionScript que procesan cierto tipo de

informacin, los evalan y luego devuelven un valor especifico (numrico o lgico) o

pueden ejecutar alguna accin especifica.

Flash provee una lista bastante completa de funciones que permiten una fcil

programacin de diferentes eventos y controles. Por ejemplo la funcin currentMonth, devuelve el mes actual del sistema.

Se pueden crear sus propias funciones para determinar la existencia de una clase en el

programa. Por ejemplo el cdigo siguiente crea una funcin llamada figuras. function figuras() { }


5.4.- METODOS

Los mtodos son acciones que el objeto tiene asignado para realizarlos de acuerdo a un

llamado o condicin especifica. Se puede uno confundir con las acciones, pero Flash las

diferencia por la sintaxis.

ACCIN: gotoAndPlay (49)

METODO: Mi_Video.gotoAndPlay(49) *

* Previamente deber crear un nombre (ej. Mi_Video) para la instancia del objeto

utilizando el Panel de Propiedades.

NOTA: Se recomienda el uso del guin bajo para nombres de instancias. Por ejemplo

Bt_menu (es una instancia del BotonMenu)

Cp_salto (es una instancia del Clip de Pelcula Salto)

5.5.- PROPIEDADES

Las propiedades son las diferentes caractersticas que definen la calidad de un objeto. Dependiendo del tipo de objeto se despliegan en el Panel de Propiedades los diferentes

valores y las cajas para modificar dichos valores.

Toda propiedad de un objeto tiene al inicio del nombre el carcter _ (barra baja) para que Flash reconozca ese nombre como una propiedad.

Por ejemplo la propiedad: _y devuelve el valor de la distancia vertical en pxeles del punto de registro del smbolo tomado desde el borde superior del escenario

(previamente el objeto deber ser convertido a smbolo)

La propiedad _root indica una referencia a la lnea de tiempo principal (escena origen o

raiz )

Las principales propiedades para controlar un objeto son:

TABLA 1: PROPIEDADES DE CONTROL DE UN OBJETO

Nombre de la

Propiedad

Valor Descripcin

_alpha Un nmero de 0 al 100 El valor del efecto alpha 0: transparente,

100 es opaco

_visible True o False Especifica si se ve o no un botn

_name Una string Se recibe un nombre

_rotation Un numero Especifica el grado de rotacin

_width Un numero en pxeles Especifica la dimensin horizontal

_height Un numero en pxeles Especifica la dimensin vertical

_x Un numero en pxeles Especifica la posicin horizontal del P.R.

(Punto Registro)

_y Un numero en pxeles Especifica la posicin vertical del P.R.

(Punto Registro)


_xscale Un numero Especifica el porcentaje del botn original a

la dimensin horizontal

_yscale Un numero Especifica el porcentaje del botn original a

la dimensin vertical

Ejemplo 4: Este programa controla la rotacin de un objeto cuya instancia es Cp_objeto. Se

debe crear un botn y asignar el siguiente Script:

// Rotacin del objeto cada 25 grados on(press) {

Cp_objeto._rotation += 25;

}

Ejemplo 5: Este programa cambia la escala de un objeto. Se deber crear un botn y

escribir:

// Ampliacin del objeto cada 10 % del tamao horiz. y vertical on(press) {

Cp_objeto._xscale += 10;

Cp_objeto._xscale += 10;

}

5.6.- VARIABLES

Flash utiliza las variables para asignar valores fijos (al inicio del programa) o valores que

cambian (durante la ejecucin). Las variables pueden contener cualquier tipo de

informacin y son celdas de la memoria del computador controladas por el programa. Una variable puede contener un valor inicial y modificarlo de acuerdo al programa.

En general existen dos tipos de variables:

Variable local: aquella que puede ser asignada con valores dentro de una misma funcin

o script.

Variable global: aquella que puede ser asignada con valores en varias funciones o script

(varias escenas)

Se puede asignar valores utilizando la palabra clave set o simplemente con una asignacin. Por ejemplo las dos siguientes instrucciones son similares y asignar un valor

a la variable Edad:

set (Edad, 35);

Edad = 35;

VARIABLES PARA CAJAS DE TEXTOS

En FLASH CS-6, en el panel de propiedades de un Texto Dinmico o Introduccin de

Texto se puede asignar los valores de las variables en el subpanel Opciones


5.7.- EXPRESIONES

Sirven para construir asignaciones de valores a las variables. Las expresiones pueden

ser escritas utilizando los operadores para nmeros o cadenas (strings) .

Ejemplo de escritura: Modo Tradicional : x = (a +b)

n . (m - n)

En Flash x = (a + b) / n * (m n );

5.8. OPERADORES

En Flash se puede utilizar operadores especiales para incrementar o decrementar una variable. Por ejemplo la expresin:

x += 7 es equivalente x = x + 7

TABLA 2: OPERADORES MAS UTILIZADOS

Smbolo Descripcin Ejemplo

+ Suma S = a + b ;

- Resta R = m n;

* Producto P = c * d;

/ Divisin D = f / g ;

% Modulo o residuo divisin 7 % 2 emite valor de 1

++ Incremento en uno x++ equivale a x = x+1;

-- Decremento en uno yequivale a y = y -1;

+= Adiciona un incremento x += 3 equivale a x= x+3;

-= Resta un decremento y -=4 equivale a y = y-4;

*= Se multiplica un valor c *= 5 equivale a c = c*5;

/= Se divide un valor d /= 2 equivale a d = d/2 ;

El ActionScript de Flash considera a los operadores un modo abreviado para especificar

una determinada operacin. Flash utiliza 6 categoras que son:

(1) Operadores Aritmticos: +, -, *, / , % (modulo), ++, --, +=, -+, *=, /= (Ver tabla)

(2) Operadores de Asignacin : asignan nuevos valores a las variables (=) NOTA: no

confundir con el operador de comparacin ==

(3) Operadores en modo bit: cambian los nmeros en valores binarios de 32 bits.

(4) Operadores de Comparacin: sirven para comparar expresiones: ==, !=, < , , >=

(5) Operadores para expresiones logicas: && (AND), || (OR) , ! (NOT)


(6) Operadores varios: otros que son estn en las 5 categoras anteriores.

Ejemplo 6: Este programa suma dos variables: Valor1 y Valor2 y asigna a una tercera

variable Suma el resultado de sumar los valores numricos de los datos ingresados por el

usuario en dos cajas de texto tipo: Introduccin de Texto (Ver Guia: EL ABC DE FLASH-

TEXTOS). Se deber crear un botn con el smbolo de + y escribir el siguiente Script:

// Suma de dos variables on(press) {

suma = number(Valor1) + number(Valor2);

}

Fig. 2 Interfaz de salida de una suma de variables

Adicionalmente se puede disear un botn borrar para resetear las cajas de introduccin de texto y la de suma. El cdigo AS2.0 de este nuevo botn ser:

// Borrar todos los datos

on(press) {

valor1 = ; valor2 = ; suma = ; }

EJERCICIOS DE REPASO

- Crear una calculadora completa con las 4 operaciones aritmticas

- Controlar los valores que solo sean numricos

- Controlar la divisin para cero con el mensaje correspondiente

5.9.- PARAMETROS

Son los valores o argumentos que indican como se va a realizar una determinada funcin

con ActionScript. Existen funciones que no necesitan parmetros, otras si. Por ejemplo la

instruccin stop(); no necesita parmetros. Pero la instruccin gotoAndPlay(10), si lo

necesita, en este caso el valor 10 es el parmetro.


5.10.- PRUEBAS DE CONDICION

En Flash las condiciones se realizan con el comando if el mismo que puede tener varios niveles. La condicion puede ser Verdadera se ejecutan las instrucciones seguidas al if,

caso contrario son Falsas y se ejecuta todo lo que queda fuera del grupo.

Ejemplo de escritura: Si a es igual a b vaya al fotograma 10 caso contrario vaya al 20 if( a == b) { gotoAndPlay (10);

}

gotoAndPlay (20);

Se puede utilizar la instruccin else, como tambin if anidados para realizar varias pruebas de condiciones en un mismo grupo del programa.

Recordando los cursos bsicos de computacin, se puede diagramar la condicin if de la

siguiente manera:

Fig. 3. Diagrama de Flujo para la instruccin condicional if-else

Ejemplo 7: El siguiente programa permite controlar la navegacin a tres distintos escenarios de

acuerdo al valor asignado en la caja Ir a pagina [ ]. Se creara un botn de control que contenga

el siguiente script:

// Navegacin con If y else

on(release) {

if(valor == 1) { // variable valor es de una caja Introduccin Texto gotoAndPlay ("Escena 2",1);

}

else if (valor == 2) {

gotoAndPlay ("Escena 3",1);

}

else if (valor == 3) {

gotoAndPlay("Escena 4",1);

}

}

Instrucciones A

Instrucciones Y

if

Verdadero

Falso (else)

Instrucciones X


Ejemplo 8: El siguiente programa permite controlar el desplazamiento de un mosquito con las teclas de las flechas. Crear un clip de pelcula con un mosquito y asignar una instancia llamada

Cp_mosquito. Crear una capa acciones y escribir el siguiente script:

// Uso del if y funciones de teclas

Cp_mosquito.onEnterFrame = function() {

if (Key.isDown(Key.UP)) {

this._rotation = 0;

this._y -=30;

} else if (Key.isDown(Key.LEFT)) {

this._rotation = -90;

this._x -=30;

} else if (Key.isDown(Key.RIGHT)) {

this._rotation = 90;

this._x += 30;

} else if (Key.isDown(Key.DOWN)) {

this._rotation = 180;

this._y += 30;

}

};

NOTA: la instruccin this se refiere al clip de pelcula Cp_mosquito, y se lo considera una referencia relativa. La instruccin _root en cambio se la relaciona como una referencia absoluta a los objetos y lnea de tiempo.

Fig. 4 Interfaz de control del mosquito

5.11.- CICLOS

Flash utiliza varias formas para realizar una repeticin de uno o ms comandos, que se

llaman bucles o ciclos los mismos que estaran encerrados en { }.

LA INSTRUCCIN for for (valor inicial, condicin, incremento) {

// instrucciones a repetirse

}

LA INSTRUCCIN while while (condicin) {

// aqu lo que se repite

}

LA INSTRUCCIN do while


do {

// aqu las instrucciones que se repiten

} while (test);

La diferencia entre un ciclofor y un while, es que con el for las instrucciones se repiten al menos una vez. En cambio con el while puede suceder que no se ejecute ninguna instruccin interna, al comprobar en la primera vez la condicin verdadera de la condicin. La instruccin do-while es parecida a la while solo que la condicion se revisa al final del ciclo y no al inicio. Ejemplo 9: El siguiente programa permite generar un ciclo circular de dibujo de un objeto en un

intervalo de 30 grados . Dibujar una hoja y crear un Clip de Pelcula Hojita y su instancia: Cp_Hojita. Crear una capa acciones y escribir el siguiente script: // ciclo de for con un valor inicial, valor final de

// control e intervalo

for (i=100; i


Fig. 6: Interfaz de salida de un ciclo con while

Ejemplo 11: El siguiente programa permite generar un ciclo con la instrucciones do-while de un objeto en un intervalo de 35 grados y variar el tono (efecto fade) . Dibujar una hoja y crear un Clip de Pelcula Hojita (con su punto de registro abajo, ver Fig 7) y su instancia: Cp_Hojita2. Crear una capa acciones y escribir el siguiente script:

// ciclo con do-while i = 0; // inicio del contador

do {

duplicateMovieClip(Cp_Hojita2, "Hojanueva" +i, i);

_root["Hojanueva" + i]._rotation =i;

_root["Hojanueva" +i]._alpha = (i/360)*100;

i +=35; // incremento del contador

}

while (i< 360); // control de la condicin

Fig. 7: Clip de pelcula con su punto de registro abajo

Fig. 8: Interfaz de salida con el efecto fade

6.- USO DE LA FUNCION RANDOM

Para muchas aplicaciones como juegos y otros sistemas interactivos es necesario

general numeros randomicos (numeros al azar calculados por el CPU del computador).

En Flash se utiliza el mtodo:

Math.random()

Punto de

Registro


Ejemplo 12: Generar nmeros aleatorios con el clic de un boton. Crear un botn y crear una caja

de texto tipo DINAMICO y su instancia: miNumeroRandomico. Seleccionar el botn y escribir el siguiente script:

// se generan numeros randomicos

on (release) {

miNumeroRandomico.text = Math.random();

}

Fig.9: Interfaz de salida

Ejemplo 13: Generar diferentes nmeros randomicos: Original, Valor Redondeado, Valor

randomico en un intervalo (ej: 1 -20) y la posicin randomica de un objeto (pentgono ). Ver la

interfaz de salida en la Fig. 10.

Fig. 10: Interfaz de diferentes aplicaciones de nmeros randomicos

NOTA: La instruccin trace permite crear una ventana de control con los datos requeridos.


7.- LOS ARREGLOS EN FLASH

Cuando se manipula informacin del mismo tipo o que tengan relacin entre si, como posicin,

propiedades, etc. Se pueden ordenar dichos datos en un set lgico conocido como array (arreglo o vector).

Cada dato de un arreglo tiene una referencia propia llamada index (ndices) la misma que tiene un valor inicial de cero (0).

Con esta referencia, se pueden realizar diferentes operaciones para todo el arreglo con solo

identificar los ndices.

La creacin de un arreglo se realiza en dos etapas:

(1) Crear un funcin constructora para iniciar el arreglo:

Miarreglo = new Array( ) // espacio entre new y Array()

(2) Asignar valores a cada elemento del arreglo:

a) valor por valor Miarreglo[0] = Carchi Miarreglo[1] = Imbabura Miarreglo[2] = Pichincha Miarreglo[3] = Cotopaxi Miarreglo[4] = Tungurahua Miarreglo[5] = Chimborazo Miarreglo[6] = Azogues Miarreglo[7] = Azuay Miarreglo[8] = Loja

b) asignar valores como parmetros de una funcin:

Miarreglo = newArray(Carchi, Imbabura, Pichincha, . Loja)

Ejemplo 14: Generar un arreglo de datos y ordenar los mismos con la funcion sort (). Se crearan dos cajas de texto Dinmico con las variables: textosalida y textosalidaordenado respectivamente. Crear un botn de control con su instancia: Bt_salida. Crear una capa acciones y escribir el siguiente script:

// creacin de un arreglo y asignacin de valores

valor= new Array();

valornuevo = new Array();

valor[0] = "Juan" ;

valor[1] = "Luis" ;

valor[2] = "Victor" ;

valor[3] = "Antonio" ;

Bt_salida.onPress = function() {

textosalida = valor[0]+" "+valor[1]+ " "+valor[2]+" "+valor[3];

valornuevo = valor.sort();

textosalidaordenado = valornuevo[0]+" "+valornuevo[1] +

" "+valornuevo[2]+" "+valornuevo[3];

}


Fig. 11: Interfaz de salida

8.- CREANDO LOS CARGADORES O PRELOADER

Para que el sistema final no presente al usuario una interfaz de espera sin ninguna informacin de lo que va a pasar, es una buena costumbre crear una pequea animacin

que indique que las animaciones se estn cargando (preloading) y se presente una interfaz con valores de la cantidad de informacin cargada (por colores, en valores

porcentuales que es lo mas comn, otras)

Se pueden crear los preloaders de dos maneras:

(1) Utilizando las instrucciones de control de fotogramas cargados:

_framesloaded y _totalframes

(2) Generando informacin sobre la cantidad de datos que ha sido descargado de todas

las animaciones del programa con las funciones (o mtodos):

getBytesLoaded( ) y getBytesTotal()

El modo mas comn es el nro. (2), pero en los dos casos, se har una comparacin de

los datos descargados con el total y esa cantidad se emitir en un campo DINAMICO, o

en un grafico de animacin que indique el progreso de la descarga.

Ejemplo 15: Disear un preloader que indique en valores porcentuales la cantidad de datos descargados. Crear un rectangulo como Clip de pelcula y su instancia: Cp_Barraprogreso

// creacion de un preloader

stop();

miIntervalo = setInterval(preloader, 10);

function preloader() {


if (_framesloaded >= _totalframes) {

play();

clearInterval(miIntervalo);

}

Cp_Barraprogreso._xscale = (_framesloaded/_totalframes)*100;

}

NOTA: la animacin del preloader no se detectara en detalle a menos que las animaciones que

empiezan desde el fotograma 2 tengan una duracin y carga grande.

Se podrn disear otro tipo interfaces para los preloaderes como:

- grficos con uso de mascaras

- barras animadas con colores degradados

- reloj de arena

- calibracin con nmeros digitales

- otros.


9.-PLANIFICACION DE UN PROGRAMA EN FLASH

Antes de comenzar a codificar es bueno planificar el programa, siguiendo los siguientes

pasos: PASOS PARA PROGRAMAR

1. Determinar cuantas escenas tendr el sistema

2. Determinar que tipo de navegacin e iconografa se usara

3. Identificar todas las animaciones (de presentacin, de apoyo, de decoracin, de

salida, otras)

4. Crear capas para (titulo, cajas de textos, botones, grficos, efectos, otros)

5. Crear los smbolos independientes del escenario (con Ctrl + F8)

6. Identificar los efectos especiales ( fade, explosin, zoom, otros)

7. Identificar los sonidos que se incluirn

8. Identificar el elemento multimedial video (si es necesario)

9. Usar componentes para mejorar las interfaces

10. Escribir los scripts con comentarios claros

11. Documentar la programacin (en un formato del Manual del Sistema)

12. Crear documentos de apoyo (Manuales, guas)

13. [OPCIONAL Crear diccionario de datos]

UBICACIN DE LOS SCRIPTS

o Si una instruccin se debe ejecutar automticamente en un determinado fotograma,

entonces en mejor escribir en ese fotograma (ej. stop(); )

o Si esperamos que se ejecute un evento como el clic del mouse, entonces asocie el cdigo

ActionScript al smbolo botn

o Se recomienda crear una capa exclusiva para Script (ej. capa acciones)

REGLAS PARA PONER NOMBRES A LOS OBJETOS

- Usar nombres lo ms implcitos y lo mas descriptivo (Ej. BotonMenu1)

- Sea consistente en el formato de los nombres (ej. nombrePropiedadFuncion)

- No usar espacios

- No usar puntos

- No usar parntesis

- No usar /

- No se puede empezar un nombre con un numero

- No usar las palabras reservadas de ActionScript (ej. stop)

- Usar Prefijos o SUFIJOS como Bt_nombre o Boton_bt para las instancias de los

smbolos de Flash.


10.- DOCUMENTACION DE PROGRAMAS DE ACTIONSCRIPT

Todo programa en FLASH CS-6 podr ser documentado indicando los siguientes elementos:

(1) Planteamiento del programa IDEA u OBJETIVO (2) Modelos de interfaz de inicio, intermedia(s), y de salida INTERFAZ (3) Objetos del programa: objetos originales, smbolos, instancias, componentes OBJETOS (4) Escenas del documento ESCENAS (5) Capas de las escenas CAPAS (6) Codificacin CODIGO (7) Notas aclaratorias: alguna breve explicacin adicional del funcionamiento

A continuacin se listan dos ejemplos de codificacin y su respectiva documentacin

EJEMPLO 1

1.- IDEA

Arrastrar objetos y posicionarlos en el lugar correspondiente (ojos, nariz, labios)

2.- INTERFAZ

(Inicial ) (Final)

3.- OBJETOS / SIMBOLOS

(1) Smbolo Grafico: Caritadepapa

(2) Smbolo Clip de Pelcula: Ojos

(3) Smbolo Clip de Pelcula: Labios

(4) Smbolo Clip de Pelcula: Nariz

4.- CAPAS:

Escena 1:

(1) Capa1: Titulo

(2) Capa2: Caritadepapa

(3) Capa3: ObjetosArrastrar (Ojos, Labios, Nariz)

5.- CDIGO en ActionScript (Se escribir en cada Clip de Pelcula)

Para el Clip de Pelcula: Ojos

// control de los ojos

on (press) {


startDrag(this); // this se refiere al objeto que se esta programando

}

on (release) {

stopDrag();

}

Para el Clip de Pelcula: Labios

// control de labios

on (press) {

startDrag(this);

}

on (release) {

stopDrag();

}

Para el Clip de Pelcula: Nariz

// control de la nariz

on (press) {

startDrag(this);

}

on (release) {

stopDrag();

}

EJEMPLO 2

1.- IDEA /OBJETIVO

Arrastrar un objeto a otros (contenedor) y rechazar si se deja fuera del contenedor

Se puede utilizar para preguntas tipo matching o de emparejamiento.

2.- INTERFAZ

(Incio) (Final)

3.- OBJETOS

(1) Objeto Clip de Pelcula: basurita

(2) Objeto Clip de Pelcula: tachobasura

(3) Caja Texto Dinmico: mitexto, variable: mensaje


4.- CAPAS:

ESCENA 1:

(1) Capa1: Titulo

(2) Capa2: basura

(3) Capa3: tacho

(4) Capa4: acciones

5.- CDIGO EN ActionScript (Se escribira en la capa acciones ) // uso de funciones drag,

// uso de la propiedad _visible

basurita_cp.onPress = function() {

// inicio del "dragging"

mensaje =" ";

startDrag(this, true);

};

basurita_cp.onRelease = function() {

// para el dragging para este clip

stopDrag();

// check si este clip

// es puesto en el tarro clip

if (this._droptarget == "/tachobasura_cp") {

// if es TRUE, hagalo invisible

setProperty(this, _visible, false);

mitexto.textColor= 0x0000ff; // color texto azul

mensaje = "Muy Bien Hecho Ciudadano!!";

} else {

setProperty(this, _x, 175);

setProperty(this, _y, 42);

mitexto.textColor= 0xff0000; // color texto rojo

mensaje =" MUY MAL"

}

};

Exitos con ActionScript !!!

Yo si hablo AS 2.0 y t?

Actionscript

Documents

Transcript of Actionscript