Tutorial ActionScript

DaNi · 05-abr-2006, 16:52

Introduccion a ActionScript
ActionScript es un lenguaje desarrollado por Macromedia y con la Ãºnica finalidad en sus inicios de agregarle interactividad a su creciente formato animaciÃ³n vectorial Flash SWF. Bien ActionScript se conoce como tal a partir de la versiÃ³n 5 de Flash y a partir de esta es cuando los diseÃ±adores se vieron en la necesidad de volverse programadores y le tuvieron que entrar al cÃ³digo pues las posibilidades que brindaba relativamente nueva tecnologÃ#a era bastante.
En fin, despuÃ©s del obligado choro introductivo, comentare que actualmente la versiÃ³n mas reciente es ActionScript 2.0 y en no mucho saldrÃ¡n las betas de ActionScript 2.5 y posteriormente el ActionScript 3.0 segÃºn publico Macromedia hace un par de meses; pero eso por ahora no nos interesa y continuaremos este mini manual o extenso tutorial (como gusten apreciarlo mejor) directamente al grano o bien tratando de meter la menos teorÃ#a posible, aunque en momentos no habrÃ¡ otra alternativa.
CaracterÃ#sticas Principales
â€¢ ActionScript estÃ¡ basado en la especificaciÃ³n ECMA-262, al igual que otros lenguajes como Javascript y C++
â€¢ Es un lenguaje de script, esto quiere decir que no harÃ¡ falta crear un programa completo para conseguir resultados, normalmente la aplicaciÃ³n de fragmentos de cÃ³digo ActionScript a los objetos existentes en nuestras pelÃ#culas nos permiten alcanzar nuestros objetivos.
â€¢ ActionScript 2.0 es un lenguaje de programaciÃ³n orientado a objetos, tiene similitudes, por tanto, con lenguajes tales como los usados en el Microsoft Visual Basic, en el Borland Delphi etc... y aunque, evidentemente, no tiene la potencia de un lenguaje puramente orientado a objetos derivado del C o del Pascal como los anteriores, cada versiÃ³n se acerca mÃ¡s a un lenguaje de este tipo. AsÃ#, la versiÃ³n 2.0 de Flash MX 2004 y Flash 8 es mucho mÃ¡s potente y mucho mÃ¡s "orientado a objetos" que su anterior versiÃ³n 1.0
â€¢ ActionScript presenta muchÃ#simos parecidos con el Javascript; si conoces Javascript, la sintaxis y el estilo de ActionScript le resultarÃ¡n muy familiares. Las diferencias entre ambos lenguajes las puede encontrar en la ayuda que acompaÃ±a al Flash.
â€¢ En la mayor parte de las ocasiones, no serÃ¡ necesario "programar" realmente, Flash MX pone a nuestra disposiciÃ³n una impresionante colecciÃ³n de "funciones" (de momento entenderemos "funciones" como "cÃ³digo ActionScript que realiza una funciÃ³n determinada") ya implementadas que realizan lo que buscamos, bastarÃ¡ con colocarlas en el lugar adecuado.
Fuente: http://www.aulaclic.es/flashmx_2004/t_17_1.htm
Javascript y ActionScript
â€¢ ActionScript no admite objetos especÃ#ficos de navegador como Documento, Ventana y Anclaje.
â€¢ ActionScript no admite completamente todos los objetos incorporados de JavaScript.
â€¢ ActionScript no admite algunas construcciones sintÃ¡cticas de JavaScript, como las etiquetas de sentencia.
â€¢ En ActionScript, la funciÃ³n eval() sÃ³lo puede realizar referencias de variables.
â€¢ ActionScript 2.0 admite diversas funciones que no se incluyen en la especificaciÃ³n ECMA-262, como las clases y la comprobaciÃ³n de tipos al compilar. Muchas de estas funciones se modelan a partir de la especificaciÃ³n del lenguaje ECMAScript (ECMA-262) ediciÃ³n 3 (consulte http://www.ecma-international.org/pu.../Ecma-262.htm).
â€¢ ActionScript no admite expresiones regulares mediante el objeto RegExp. No obstante, Macromedia Central sÃ# es compatible con el objeto RegExp. Para mÃ¡s informaciÃ³n sobre Macromedia Central, consulte www.macromedia.com/software/central.
Fuente: Ayuda de Flash. Libro: Aprendizaje de ActionScript en Flash 2.0, â€œDiferencias entre Javascript y Actionscriptâ€
Bien entendido esto un poco, pasaremos directamente al cÃ³digo que es lo que nos interesa y comenzaremos por el estilo de programar, mejor conocido como sintaxis.
Sintaxis
La sintaxis de flash es como antes mencionaba un script y en particular muy, pero muy similar a los de java, aunque con sus respectivas diferencias, y aquÃ# tratare de explicar como funciona.
En general el cÃ³digo se escribe de la siguiente manera

Código:

var a:Function = function (){
_root.onEnterFrame.play(movie_mc);
};

Si somos observadores veremos que hay mÃ¡s parÃ¡metros que los especificados en el ejemplo 1, y esto se debe a que en la practica entre mas especifico sea nuestro script, menos probabilidades de errores tendremos en el molesto tiempo de depuraciÃ³n.
En el script anterior encontramos que la funciÃ³n que se ejecuta, la define una variable, la cual es â€œaâ€. Las variables en flash al igual que en otros lenguajes de programaciÃ³n, representa la informaciÃ³n o datos que son cambiantes a lo largo de la ejecuciÃ³n del programa, y en flash se definen por la palabra clave â€œvarâ€. AquÃ# algunos ejemplos:

Código:

var casa:String = â€œMi casa rojaâ€;
var coche:String = â€œMi coche es un BMWâ€;
var edad:Number = â€œ25â€;
vivo = â€œMexicoâ€;

Si ponemos atenciÃ³n a los ejemplos anteriores encontraremos que no todas las variables son iguales, y eso es un error del programador. En Flash y mas en especifico en ActionScript se declara una varible con la palabra clave â€œvarâ€, hasta aquÃ# todo esta bien, sin embargo todo lo que se encuentre a la izquierda de un signo de â€œ=â€ es considerado una variable.
Entonces si funciona lo mismo escribir:

Código:

var casa:String = â€œMi casa rojaâ€;

Que escribir:

Código:

vivo = â€œMexicoâ€;

Que caso tiene utilizar â€œvarâ€, el asignador â€œ:â€ y la palabra â€œStringâ€ para declarar mis variables. Pues esto tiene una explicaciÃ³n de logÃ#stica que en un futuro nos evitara muchos dolores de cabeza; ya que el motor compilador de flash viene incluido a partir de la versiÃ³n MX 2004 con un comprobador de tipos. Â¿Esto para que nos sirve? Ahora lo muestro:

Código:

var edad:Number = â€œ25â€; //Correcto
var edad:Number = â€œVeinticincoâ€; //Incorrecto y genera error.

En el ejemplo anterior creo que mas claro no podrÃ#a dejarlo. Cuando aplicamos un tipo a una variable, forzamos al compilador a que este reconozca exclusivamente el tipo de valor asignado, de lo contrario no se ejecutara y generara un mensaje de error, ejemplo:

Código:

var edad:Number = â€œVeinticincoâ€; //Incorrecto y genera error.

Flash nos responderÃ¡ con el siguiente mensaje en el panel de salida:

Código:

El tipo de la declaraciÃ³n de asignaciÃ³n no coincide: se encontrÃ³ String donde se requiere Number.

Esto aparentemente es un problema, pero cuando comencemos a escribir cÃ³digos mas complejos, le daremos gracias con creces, pues el compilador nos esta diciendo donde esta nuestro error de lÃ³gica.
En conclusiÃ³n, es bastante recomendable utilizar siempre la comprobaciÃ³n de tipos para nuestras variables, ya que esto nos ayudara mucho a evitar futuros errores en el momento de la compilaciÃ³n.
Nota: todos los tipos se comprueban, todos excepto el â€œobjectâ€, que flash hace caso omiso a el. Para mÃ¡s informaciÃ³n., leer el manual de ayuda del programa. â€œComprobaciones de tipoâ€.
[break=Los Operadores]
Una vez entendida una de las principales bases del lenguaje que son las variables, ahora entraremos a otro de mayor importancia y son los operadores.
Puede que se pregunten por el uso de sÃ#mbolos matemÃ¡ticos en el cÃ³digo. Los sÃ#mbolos se denominan operadores en ActionScript. Los operadores calculan un valor nuevo a partir de uno o varios valores y un operador le permite asignar un valor a una variable del cÃ³digo, por ejemplo el operador de igualdad (=) permite asignar un valor a una variable:
Los operadores son caracteres que especifican cÃ³mo combinar, comparar o cambiar los valores de una expresiÃ³n. Una expresiÃ³n es cualquier sentencia para la que Flash puede calcular el resultado y que devuelve un valor. Puede crear una expresiÃ³n combinando operadores y valores, o bien llamando a una funciÃ³n.
El lenguaje ActionScript estÃ¡ formado por clases incorporadas, por lo que se deberÃ¡ utilizar la sintaxis correcta para formar sentencias de manera que el cÃ³digo se compile y funcione correctamente en Flash. En este caso, la sintaxis se refiere a la gramÃ¡tica y la ortografÃ#a de un lenguaje que le permite programar. El compilador no comprende la sintaxis incorrecta, por lo que observarÃ¡ errores o advertencias en el panel Salida cuando intentes comprobar el documento en el entorno de prueba o no se ejecutara cuando se haya exportado a SWF el contenido. Por consiguiente, la sintaxis es un conjunto de reglas y directrices que le ayudan a formar cÃ³digo ActionScript correcto.
Una sentencia es una instrucciÃ³n que se da al archivo FLA para que haga algo, como, por ejemplo, ejecutar una acciÃ³n concreta. Por ejemplo, puede utilizar una sentencia condicional para determinar si algo es verdadero o si existe. Posteriormente, podrÃ#a ejecutar las acciones que especifique, como, por ejemplo, funciones o expresiones, en funciÃ³n de si la condiciÃ³n es verdadera o no. La sentencia if es una sentencia condicional que evalÃºa una condiciÃ³n para determinar la siguiente acciÃ³n que debe tener lugar en el cÃ³digo.
[break=Operadores de sufijo]
Los operadores de sufijo toman un operador y aumentan o reducen el valor del operador. Aunque estos operadores son unarios, se clasifican independientemente del resto de operadores unarios debido a su mayor precedencia y a su comportamiento especial.

++ Incremento (sufijo)
-- Decremento (sufijo

Ejemplo:

Código:

var suma:Number = 1;
cantidad = ++suma;
trace(suma);

En el ejemplo anterior la variable â€œsumaâ€ tiene un valor numÃ©rico asignado de 1, en la instrucciÃ³n siguiente aparece otra variable no asignada (object por defecto) con el operador de incremento â€œ++â€ y ese se asigna a la variable suma y en una tercera instrucciÃ³n le decimos que trace la variable suma. En nuestro panel de salida obtendremos â€œ2â€ como resultado de este script.
Al â€œtraducir al espaÃ±olâ€ este script le dice al programa que â€œsumaâ€ tiene un valor de 1, pero cantidad tiene una instrucciÃ³n que incremente en uno a â€œsumaâ€ y en la tercera lÃ#nea le decimos a flash que escriba la variable â€œsumaâ€ la cual tiene un valor de 1 mas 1 agregado en la segunda instrucciÃ³n, nos mostrara un resultado de 2.
[break=Operadores unarios]
Los operadores unarios utilizan un operando. Los operadores de incremento (++) y decremento (--) de este grupo son operadores de prefijo, lo que significa que aparecen delante del operando en una expresiÃ³n. TambiÃ©n pueden aparecer tras el operando, en cuyo caso son operadores de sufijo.

++ Incremento (prefijo)
-- Decremento (prefijo)
+ + unario
! - unario (negaciÃ³n)
typeof Devuelve informaciÃ³n de tipo
void Devuelve un valor no definido

Ejemplo:

Código:

var f:Number = 1;
var g:Number = 1;
var h:Number = f + g;
var i:Number = h;
trace(i);

Con esto flash nos devolverÃ¡ un valor de 2. Explico el porque. Asignamos que un valor de 1 a â€œfâ€, y lo definimos como tipo â€œNumberâ€ al igual que lo hicimos con â€œgâ€; por el contrario a la variable â€œhâ€ no le asignamos un valor numÃ©rico directamente, pero si especificamos que es un valor de tipo â€œNumberâ€ Â¿QuÃ© pasa aquÃ#? Â¿Por quÃ© no genera error? Â¿Y lo mismo para la variable â€œiâ€? Esto sucede porque al momento de la compilaciÃ³n flash solo entenderÃ¡ que 1+1 es igual 2 y ese valor le asignara a â€œhâ€ por lo tanto no contraviene con la declaraciÃ³n de tipo que le asignamos a esta; sucede lo mismo con la variable â€œiâ€ la cual flash entiende que â€œiâ€ es igual a â€œhâ€ y si â€œhâ€ tiene un valor de â€œ2â€ entonces â€œiâ€ tambiÃ©n lo tiene, por lo que en la ultima instrucciÃ³n trazara 2 en el panel de salida.
[break=Operadores multiplicativos]
Los operadores multiplicativos toman dos operandos y realizan cÃ¡lculos de multiplicaciÃ³n, divisiÃ³n o mÃ³dulo. Entre los operadores numÃ©ricos tambiÃ©n figuran los operadores aditivos.
Todos los operadores de esta tabla tienen idÃ©ntica precedencia:

* MultiplicaciÃ³n
/ DivisiÃ³n
% MÃ³dulo

Ejemplo:

Código:

var f:Number = 2;
var g:Number = 2;
var h:Number = f*g;
var i:Number = h;
trace(i);

Este ejemplo nos devolverÃ¡ un valor numÃ©rico de 4 en el panel de salida.
[break=Operadores relacionales]
Los operadores relacionales toman dos operandos, comparan sus valores y devuelven un valor booleano (verdadero o falso). Todos los operadores de esta tabla tienen idÃ©ntica precedencia:

< Menor que
> Mayor que
<= Menor o igual que
>= Mayor o igual que
instanceof Comprueba una cadena prototipo
in Comprueba las propiedades de objetos

Ejemplo:

Código:

var f:Number = 2;
var g:Number = 2;
var h:Boolean = f<=g;
var i:Boolean = h;
trace(i);

Este ejemplo devolverÃ¡ en el panel de salida â€œtrue" (verdadero) porque â€œfâ€ es menor o igual a â€œgâ€. En este ejemplo si sois observadores, verÃ¡n que ha cambiado la asignaciÃ³n de tipos de â€œhâ€ e â€œiâ€ de Number a â€œBoolean"; esto forzara al compilador a solo recibir valores verdadero o falso, y estos operadores relacionales solo devuelven de esta forma.[/break]
[break=Operadores de igualdad]
Los operadores de igualdad toman dos operandos, comparan sus valores y devuelven un valor booleano. Todos los operadores de esta tabla tienen idÃ©ntica precedencia:

== Igualdad
Â¡= Desigualdad
=== Igualdad estricta
Â¡== Desigualdad estricta

Ejemplo:

Código:

var f:Number = 2;
var g:Number = 2;
var h:Boolean = f==g;
var i:Boolean = h;
trace(i);

Este ejemplo devolverÃ¡ â€œtrueâ€ (verdadero) en el panel de salida.
[break=Operadores de asginacion]
Los operadores de asignaciÃ³n toman dos operandos y asignan un valor a un operando en funciÃ³n del valor del otro operando. Todos los operadores de esta tabla tienen idÃ©ntica precedencia:

= AsignaciÃ³n
*= AsignaciÃ³n de multiplicaciÃ³n
/= AsignaciÃ³n de divisiÃ³n
%= AsignaciÃ³n de mÃ³dulo
+= AsignaciÃ³n de suma
-= AsignaciÃ³n de resta
<<= AsignaciÃ³n de desplazamiento a la izquierda en modo bit
>>= AsignaciÃ³n de desplazamiento a la derecha en modo bit
>>>= AsignaciÃ³n de desplazamiento a la derecha en modo bit sin signo
&= AsignaciÃ³n de AND en modo bit
^= AsignaciÃ³n de XOR en modo bit
|= AsignaciÃ³n de OR en modo bit

Ejemplo

Código:

var f:Number = 2;
var g:Number = 10;
var h:Number = f*=g;
var i:Number = h;
trace(i);

Este ejemplo devolverÃ¡ 20 como resultado de la multiplicaciÃ³n de f * g.
Existen muchos mas operadores, los cuales podemos encontrar mucha informaciÃ³n detallada en la Ayuda, Operadores. del programa. Estos otros son un tanto mas complejos[/break]

imported_LorD_FeniX · 05-abr-2006, 17:21

Gracias es un magnifico tutorial (lo has echo tu?) Saludos!!

DaNi · 05-abr-2006, 17:26

Cita:

Iniciado por LorD_FeniX

Gracias es un magnifico tutorial (lo has echo tu?) Saludos!!

Despues de 3 tutoriales no doy para tanto, es un tutorial que hice hace un tiempo con un amigo, bueno yo buscaba info y el redactaba y todavia seguia en el foro donde lo publicamos, y aqui esta

SnoK · 05-abr-2006, 17:51

Increible, esta muy bien pero, partelo en diferentes partes, osea en diferentes paginas.
Esque es un poquito largo xDDD

DaNi · 05-abr-2006, 17:56

como mucho puedo amrcar un poco mas las partes xD pero partirlo na xD

SnoK · 05-abr-2006, 18:03

Lo digo mayormente para ahorrar trabajo a los moderadores ya que en otro tutorial le pidieron que lo hiciera a otra persona.

iRRa:
He dividido el tutorial en secciones para mejorar su visualizaciÃ³n. Os recuerdo que podÃ©is partir los tutoriales en varias secciones con el siguiente cÃ³digo:

Cita:

[break=TITULO]TEXTO[/break]

DaNi · 05-abr-2006, 18:09

voy a ello, esta mu bien este code nunca lo habia visto

EDITO: ya esta todo perfecto

SaLuDoS

Slaad · 05-abr-2006, 18:50

EstÃ¡ muy bien el tutorial, felicidades tio! un saludo!

iRRa · 05-abr-2006, 20:22

Muy buen tutorial. Gran aporte, felicidades!!! SIgue asÃ#