Taller Webmaster

Tutoriales para Webmasters

Bienvenido a Taller Webmaster, donde encontrarás la mejor información sobre tutoriales y recursos para webmasters!

Ingreso de Usuario

Recuperar contraseña

Registro de Usuario

Publicidad

ActionScript Flash Introducción

Tutorial Photoshop

 

Tutorial por Solo Photoshop

SoloPhotoshop

TUTORIALES MACROMEDIA FLASH

ActionScript, Introducción al lenguaje - Parte 1

Por Kitsch, http://www.javiernavarro.be/

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 chorro 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 www.ecma-international.org/publications/standards/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

function nombrefuncion (){
instrucciones de la función
...
}

Esto es, se declara siempre la variable u objeto, acción, método o función y las instrucciones que realizara cuando se cumplan los parámetros especificados. A continuación pongo un ejemplo un poco mas practico:

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:

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 variable 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:

var casa:String = "Mi casa roja";

Que escribir:

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:

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:

var edad:Number = "Veinticinco"; //Incorrecto y genera error.

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

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".

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.

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:

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.

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:

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.

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:

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.

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:

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.

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:

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.

Operadores de Asignación

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

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

Las Propiedades y Tipos de Objetos Principales

Todos los símbolos de botón, símbolo o MovieClip de un archivo SWF son instancias del objeto y se pueden asignar nombres de instancia en el inspector de propiedades y utilizar los métodos y propiedades de la clase Button, MovieClip y Simbol para manipularlos con ActionScript. Los nombres de instancias de Button, MovieClip o Simbol se muestran en el explorador de películas y en el cuadro de diálogo Insertar ruta de destino del panel Acciones.

Estas tres clases son practicante la base de nuestros archivos SWF, y mas en claro de nuestras películas y programas flash; pues en 80% de las veces trabajaremos con ellos para crear interactividades y dinamismo a nuestros programas.

Enlistar aquí todas las propiedades aplicables cada una de estas clases me llevaría muchísimo tiempo, además de que de momento no utilizaremos todas, pero para consultas detalladas, todas las funciones se encuentran en la ayuda el programa en el libro Aprendizaje de ActionScript. 2.0

Si deseas que algo funcione en el archivo SWF, deberás hacer referencia a la instancia en cuestión y luego indicarle que haga algo, como asignarle una acción o cambiar su propiedades. Normalmente deberá definir el lugar en el que se encuentra dicha instancia en el archivo SWF (por ejemplo, en qué línea de tiempo se encuentra o en qué instancia está anidada) mediante la creación de la ruta de destino, al hacer esto, está haciendo referencia a dicha instancia en particular e indicándole que haga algo (por ejemplo, mover la cabeza lectora o abrir una página Web).

Ejemplo:

var a:Function = function () {
_root.mianime_mc._alpha = 35; //esta linea escribe la ruta de acción
if (b="activado") {
_root.miamine_mc._alpha = 100;
} else {
_root.mianime_mc._alpha = 35;
}
};

En este ejemplo hay un función simple (mas compleja de lo antes visto pero no importa) que le dice al compilador que la variable "a" asignara la propiedad "alpha" a el objeto "mianime_mc" el cual es un MoviClip y se asigna la ruta mediante un "target" que el compilador le de la siguiente manera:

_root.mianime_mc.alpha = 35;

_root: define el nivel donde funcionara la instrucción; este puede ser _root el nivel principal; _this, mismo nivel o _parent, relativo.

mianime_mc: es el nombre de instancia que asignamos a nuestro objeto MovieClip.

_alpha: propiedad aceptada y validad de la Clase Object aplicada a la clase heredada MovieClip.

Nota: No importa si hasta el momento no se entiende mucho el script y los términos, mas delante veremos cada uno a detalle, solo deseo que se entienda la estructura en general.

Bien, retomando; los tres elementos nombrados previamente actuaran y se "enlazaran" entre si por medio del operador "." el cual en Flash tiene la función de unir argumentos, instancias y propiedades.

En conclusión las propiedades en ActionScript representan las definiciones que aplicaremos a los objetos afectados por ellas; tamaño, color, forma, etc.; y trabajaremos con estas a lo largo de todos nuestros programas, entre mejor definidas estén, mejores serán mejor los resultados.

Parte 2

Comentarios de ActionScript Flash Introducción

↑ Tutorial

  • hoja

    hoja

    2006-07-18 14:02

    MUCHAS GRACIAS POR ESTA INFORMACIÓN, ES BUENO COMENZAR DE UNA FORMA SENCILLA CON ESTO DE LAS ACTIONS
  • wet431

    wet431

    2006-12-11 13:20

    bueno espero que llegen pronto a la animacion en tresd y es bune saber todo esto yaque como publiscista es necesario
  • julilarez

    julilarez

    2007-03-07 16:37

    siento q voy entendiendo de a poquito...gracias!
  • rodr1go4

    rodr1go4

    2007-07-16 19:37