Robot04 » ActionScript 3.0

Eclipse FDT Loading Workbench Cuelgue

Robot04 — Sat, 03 Jul 2010 11:12:28 +0000

Si alguna vez te ocurre que al abrir Eclipse se te queda en: Loading Workbench… esta es la solución:

Vas a .metadata/.plugins/org.eclipse.core.resources y borras el archivo .snap

Enamorado de Signals

Robot04 — Sun, 13 Jun 2010 02:15:53 +0000

Y para muestra un botón

Actionscript:

package view.ui.common
{
import com.greensock.TweenMax;
import flash.events.MouseEvent;
import org.osflash.signals.natives.NativeSignal;

import flash.display.Sprite;

/**
* @author robot04
*/
public class BasicButton extends Sprite
{
private var overed:NativeSignal;
private var outed:NativeSignal;
public var clicked:NativeSignal;

public function BasicButton()
{
buttonMode = true;
mouseChildren = false;
overed = new NativeSignal(this, MouseEvent.MOUSE_OVER);
outed = new NativeSignal(this, MouseEvent.MOUSE_OUT);
clicked = new NativeSignal(this, MouseEvent.CLICK, MouseEvent);
}

public function removeListeners():void
{
overed.remove(onOver);
outed.remove(onOut);
}

public function addListeners():void
{
overed.add(onOver);
outed.add(onOut);
}

protected function onOut(event:MouseEvent):void
{
TweenMax.to(this, .4, {alpha:1});
}

protected function onOver(event:MouseEvent):void
{
TweenMax.to(this, .4, {alpha:.8});
}
}
}

Robert Penner - Signals

Reforest

Robot04 — Sun, 13 Jun 2010 01:57:27 +0000

Reforest es una aplicación desarrollada en Adobe AIR que crea estructuras de proyecto a través de plantillas.

Estas plantillas pueden ser configuradas al gusto de cada uno para crear el árbol de carpetas y archivos que formarán nuestro directorio de proyecto.
El ejemplo que viene con Reforest, cuando lo descargáis, es un MVC simple con Flash y AS3, pero se puede utilizar para cualquier tipo de proyecto, diseño, .php, html, etc

La plantilla, a partir de ahora semilla (.seed), está compuesta por los siguientes nodos:

info

Info es la parte de la semilla que nos va a proveer de la información de ésta, como autor, fecha, nombre, descripción, etc.

Esta es la estructura:

XML:

>
>
>Robot04>
>09/09/09>
>Example Template>
>Estructura de proyecto base con vista y controlador>
>Acuérdate de borrar el árbol de main.fla >
>
>

Después encontramos la estructura.

structure

Structure es la etiqueta que va a contenter nuestro proyecto, y en ella podremos crear y copiar los archivos y directorios que solamos utilizar frecuentemente en nuestros proyectos.

Dentro de structure podremos utilizar dos tipos de etiquetas diferentes:

folder
file

folder

Folder es la encargada de crear los directorios, tiene un sólo parámetro obligatorio name.
Si el valor del parámetro name es projectName, el valor se sustituirá en tiempo de ejecución por el nombre que elijamos para el proyecto.

XML:

>
>
>Robot04>
>09/09/09>
>Example Template>
>Estructura de proyecto base con vista y controlador>
>Acuérdate de borrar el árbol de main.fla >
>
>
name="projectName">
>
>
>

file

El nodo file se encarga de copiar archivos y carpetas a nuestro directorio de proyecto.

Tiene dos parámetros obligatorios:

name
route

Name indica el nombre con el cual se guardará el archivo en nuestro directorio de proyecto y route es el path al archivo que se va a copiar.

XML:

>
>
>Robot04>
>09/09/09>
>Example Template>
>Estructura de proyecto base con vista y controlador>
>Acuérdate de borrar el árbol de main.fla >
>
>
name="projectName">
name="flash">
name="main.fla" route="files/flash/main.fla" />
>
>
>

Además de esto y esta es la joyita de Reforest, el nodo file tiene un atributo opcional parse.

Si le decimos a Reforest que parsee el documento con el atributo parse="true". Reforest buscará en esos archivos variables de Reforest y nos permitirá durante la creación del proyecto cambiar sus valores por otros al vuelo.

Las variables de Reforest tienen el siguiente aspecto:
%RFST:Variable=Valor%

Por ejemplo un uso básico en archivo html podría ser:
%RFST:title=titulo%

o en un .as podríamos ajustar las características de nuestro fla de la siguiente manera:

Actionscript:

[SWF(width="%RFST:SWFWidth=1004%", height="%RFST:SWFHeight=680%", backgroundColor="%RFST:SWFBGColor=#FFFFFF%", frameRate="%RFST:SWFFramerate=30%")]

Espero que lo disfrutéis y si tenéis sugerencias o dudas, ya sabéis

PD: Junto con el instalador de Reforest encontraréis más información y un ejemplo de uso.

AIR Autoupdater en 10 pasos

Robot04 — Tue, 14 Jul 2009 17:12:08 +0000

Ale, aquí os dejo cómo configurar un autoupdater para AIR en diez pasos.

1. Bajar el SDK de AIR.
2. Copiar el archivo applicationupdater_ui.swc a nuestra carpeta de proyecto.
3. Linkarlo en configuración de publicación.

4. Crear un updateConfig.xml con los siguientes parámetros:

XML:

<?xml version="1.0" encoding="utf-8"?>
xmlns="http://ns.adobe.com/air/framework/update/configuration/1.0">
>http://www.robot04.com/reforest/update.xml>
>1>
>
   name="checkForUpdate" visible="false" />
   name="downloadUpdate" visible="true" />
   name="downloadProgress" visible="true" />
   name="installUpdate" visible="true" />
   name="fileUpdate" visible="false" />
   name="unexpectedError" visible="true" />
>
>

5. En el Main o donde iniciéis la app (esto es solo una muestra, a partir de aquí se pueden jugar con todos los parámetros del ApplicationUpdater y configurarlo a vuestro gusto):

Actionscript:

package
{
import air.update.events.UpdateEvent;
import air.update.events.StatusUpdateErrorEvent;
import flash.events.ErrorEvent;
import air.update.events.StatusUpdateEvent;
import air.update.ApplicationUpdaterUI;

public class Main
{
public function Main()
{
initUpdater();
}
public function initUpdater():void
{
appUpdater = new ApplicationUpdaterUI(); appUpdater.addEventListener(StatusUpdateErrorEvent.UPDATE_ERROR, updateError);
appUpdater.addEventListener(UpdateEvent.INITIALIZED, updateInitialized);
appUpdater.addEventListener(StatusUpdateEvent.UPDATE_STATUS, updateStatus);
appUpdater.configurationFile = new File("app:/updateConfig.xml");
appUpdater.initialize();
}
private function updateInitialized(event:UpdateEvent):void
{
checkForUpdates();
}
private function checkForUpdates():void
{
appUpdater.checkNow();
}

private function updateError(event:ErrorEvent):void
{
trace("Error");
}

private function updateStatus(event:StatusUpdateEvent):void
{
trace("update status: " + event.version);
trace("update available: " + event.available);
trace("update details: " + event.details);
}
}
}

6. Añadir el updateConfig.xml en los settings de AIR: File --> AIR Settings --> Included Files + updateConfig.xml.
7. Compilar versión dejando, por ejemplo, en los AIR Settings en el campo de versión 0.90, la instalamos y compilamos otra versión cambiando el valor de la versión a la 0.91.
8. Crear un update.xml con:

XML:

<?xml version="1.0" encoding="utf-8"?>
xmlns="http://ns.adobe.com/air/framework/update/description/1.0">
>0.91>
>http://www.robot04.com/reforest/reforest.air>
> Versión 0.91
* Añadida actualización automática
]]>>
>

9. Subir la versión nueva y el update.xml al servidor.
10. Añadir un nuevo tipo MIME ".air" al server

Abrimos la aplicación instalada y veremos que nos aparece la ventana de Update para descargar la nueva versión.
Nota: joder que mal se ven los estilos de syntax hiliter para los xml. Ya lo cambiaré.

Config Constants – ActionScript 3.0

Robot04 — Mon, 04 May 2009 14:55:20 +0000

Config Constants en Flash CS4. Con la creación de las constantes de configuración podemos acceder a partes de nuestro código dependiendo del valor de las mismas. Para ver un pequeño ejemplo, imaginad que tenéis un fla que va a ir en dos idomas, con las constantes podemos hacer que un mismo fla (o fla diferentes) accedan a un idioma en la programación o a otro.

Creamos un par de Constantes, una para el español CONFIG::ES y otra para el portugués CONFIG::PT y le damos a la primera un valor de true y a la segunda un valor de false en la configuración de publicación.

Después en nuestro código podremos tener lo siguiente:

Actionscript:

public function createButtons():void
{
CONFIG::ES
{
botones = [ "El sistema de franquicias", "Pasos a seguir", "Tipos de tienda",
"Inversión inicial", "Criterios de emplazamiento" ];
}

CONFIG::PT
{
botones = [ "O sistema de franchising", "Passos a seguir", "Tipos de loja",
"Investimento Inicial", "Critérios de localização" ];
}
}

Al compilar la película flash cogerá lo que aparezca dentro del CONFIG::ES e ignorará lo que esté dentro del CONFIG:PT.

Fases de propagación de eventos – ActionScript 3.0

Robot04 — Sat, 25 Apr 2009 12:28:14 +0000

Stage-->MainTimeLine-->MovieClip-->TextField-->MovieClip-->MainTimeline-->Stage

Cuando el evento se transmite hacia el objeto se le conoce como la Fase de Captura.
Cuando llega al TextField es la Target Fase.
Cuando vuelve a subir hacia el Stage Fase de Burbujeo (Bubbing)

La fase de captura no se utiliza a no ser que lo especifiques explicitamente.

Actionscript:

clip_mc.addEventListener(MouseEvent.CLICK, botonClick, true);

Se suele usar para deshabilitar eventos.

Eventos – ActionScript 3.0

Robot04 — Sat, 25 Apr 2009 12:26:48 +0000

Para enviar eventos usamos la clase EventDispatcher.
Se puede usar por herencia o por composición.

Después tenemos que crear el evento

Actionscript:

var event:Event = new Event("change");

o lo que sería mejor

Actionscript:

var event:Event = new Event(Event.CHANGE);

y después tenemos que distribuir (lanzar) el evento:

Actionscript:

dispatchEvent(event);

Para usarlo por composición tenemos que implementar IEventDispatcher
En el constructor nos creamos un nuevo EventDispatcher();

Actionscript:

dispatcher = new EventDispatcher(this); //donde this es el target que distribuye el evento.

Después en cada función definida por la Interfaz devolvemos el dispatcher:

Actionscript:

return dispatcher.dispatchEvent(event);
return dispatcher.hasEventListener(type);
return dispatcher.willTrigger(type);
return dispatcher.removeEventListener(type, listener, useCapture); etc

Cualquier DisplayObject hereda de DispatchEvent
Si queremos crear un evento propio nuestro tenemos que crear una nueva clase que herede de Event y que llame explicitamente al constructor y crear una constante estática con el nombre y valor que queramos como evento.

Actionscript:

public static const LIMITE_EXCEDIDO:String = "limite";

Después en la clase en la que vamos a usar el evento generamos un nuevo evento EjemploEvent

Actionscript:

var evento:EjemploEvent = new EjemploEvent(EjemploEvent.LIMITE_EXCEDIDO);
dispatchEvent(evento);

En la clase en la que nos vayamos a apuntar al evento

Actionscript:

foo.addEventListener(EjemploConEvento.LIMITE_EXCEDIDO, funcion);

Objetos y clases – ActionScript 3.0

Robot04 — Sat, 25 Apr 2009 12:23:15 +0000

Programación Procedural
Instrucciones que generan procedimientos
En ActionScript todo lo relacionado a funciones que generan tareas.

Pros
- Implantación rápida, resultados rápidos

Contras
- Poco mantenible a la larga, en aplicaciones con más de 500 líneas de código.

Orientado a Objetos
Divide el código en entidades diferentes

Pros
Escalables
Metodología de programación

Contras
Implantación lenta
Fácil abuso de ella sobrearquitectura de las cosas

Objeto
Es un subprograma que mantiene información y funcionalidad que maneja esa información que se está guardando
A los datos se los conoce como propiedades y a las funciones cómo métodos.

Clases
Plantilla para crear objetos
Definición abstracta de lo que va a ser un objeto.
Todos los objetos creados a partir de una misma clase van a tener los mismos métodos y propiedades.
Lo que crea un objeto único o diferente a otro es el valor de las propiedades.

Clases sin propiedades se hacen estáticas como la clase Math.

Todo lo que se puede hacer en flash está encapsulado en clases.

Paquetes
Un paquete puede contener otro paquete, clases o definiciones de funciones.

1.- Paquete Flash
La utilización de este paquete no añade código ni peso a nuestra película. Se encuentra integrado dentro del flash player.

2.- Librería FL
Son los componentes de flash. No viene compilada dentro del flash player. Hay que añadir el código a la película flash cuando usemos un componente.

3.- Libería mx
Componentes de Flex

Sirven para organizar el código y para que no halla colisión entre nombres.

Como crear un objeto a partir de una clase

Operador new

Actionscript:

var punto:Point = new Point(); // instancia un objeto de la clase Point

Una vez instanciado el objeto podemos acceder a sus métodos y propiedades

Actionscript:

punto.x = 30;
trace(punto);

punto.offset(30, 10); // Offset desplaza el punto
trace(punto); salida (60, 10);

El constructor puede recibir parámetros, si vienen entre corchetes, éstos son opcionales.

Si escribimos el código en línea de tiempo podemos usar los paquetes sin importarlos.
Cuando trabajemos con clases tenemos que importar las clases.

import flash.geom.Point;
import flash.geom.*; // importa el paquete entero

Importando una clase no se añade el código al swf. Si no tiene el paquete importado se va a ir al top level a buscar.
En el momento de compilación busca las clases y las compila en el .swf

Cuando se instancia una clase flash va a mirar si es una clase del top level --> si no, se pone a mirar en las directivas import del código para buscar la clase.

COMO CREAR UNA CLASE
creamos el nombre del paquete, si no va dentro de ningún paquete lo dejamos vacío pero usamos la declaración de package

Por cada archivo de ActionScript solo puede haber una definición o de función o de clase.

CLASSPATH (rutas de clase)
Ruta donde va a buscar flash las clases en el disco.

1.- DE DOCUMENTO
2.- GLOBALES

Se configuran en preferencias --> ActionScript
De manera predeterminada vienen dos classpath por defecto
"." va a buscar en el mismo directorio que el propio archivo .fla
$(AppConfig)/ActionScript 3.0/Classes va a buscar en el directorio Adobe Flash CS3 es
Archivos .swc código precompilado ,no son más que archivos .zip con un archivo xml y otro swf

Podemos insertar los classpath que queramos

Librería Standard (Clases de Flash)
Clases del proyecto (Clases que están al lado del fla)
Nuestra librería de clases

En configuración de publicación en la pestaña de Flash tenemos tambien una Ruta de Clases, pero solo para ese archivo.

En configuración de publicación tenemos una pestaña que crea un SWC, código precompilado para dar al cliente cuando no queremos dar nuestras clases.

ATRIBUTOS DE CONTROL DE ACCESO o Visibilidad

Se usan tanto en propiedades como métodos, asigna quien puede utilizar esa función, clase o método.

public: cualquiera puede ver/utilizar esa definición
private: solo se puede usar desde este código (desde esta clase), métodos de ayuda dentro de la clase. Pensado para uso interno.
protected: lo pueden ver la clase y las subclases
internal: solo puede ser visto por otras clases que estén dentro del mismo paquete. Es el valor por defecto cuando no ponemos ningún atributo.

PROGRAMACIÓN ORIENTADA A OBJETOS

CUALIDADES
1- Abstracción:
Nunca se debería saber el funcionamiento de una clase para poder usarla.

2.- Encapsulamiento:
Una clase no debería dejar modificar sus propiedades.
No poner propiedades públicas.

3.- Herencia
4.- Polimorfismo

Polimorfismo – ActionScript 3.0

Robot04 — Sat, 25 Apr 2009 12:14:06 +0000

Capacidad de una clase para comportarse como diferentes tipos de clases.

Se hace la diferencia entre tipo y clase, es decir, la clase círculo es del tipo FormaGeometrica.

Actionscript:

var c:Circulo = new Circulo(); // Círculo hereda de FormaGeometrica
function medirAncho(a:FormaGeometrica) : void
{
trace(a.ancho);
}
medirAncho(c);

Esto es posible gracias al polimorfismo, el tipo puede ser la superclase (FormaGeometrica) y el valor siempre será el objeto que pasemos, es decir, si como tipo ponemos la superclase podremos pasar como parámetro cualquiera de las subclases (Circulo, Cuadrado, Triangulo, etc).

Después con is podemos averiguar de que tipo es la clase y actuar de una forma u otra con ella.
Pej.

Actionscript:

function medirAncho(a:FormaGeometrica) : void
{
if(a is Circle)
{
trace(a.radius * 2);
}
if(a is Rectangle)
{
trace(a.ancho);
}
}

Cuando hablamos de polimorfismo podemos decir: "Tiene un..."

Herencia – ActionScript 3.0

Robot04 — Sat, 25 Apr 2009 12:04:09 +0000

La herencia es una relación entre clases.
Permite que una clase herede la funcionalidad de otra (propiedades y métodos).

A la clase superior se la conoce como clase superior o clase base. La clase que hereda se la conoce como subclase o extensión.
Una subclase solo puede tener una superclase.

Cuanto más se baja en la cadena de herencia se vuelven más especializadas las clases.

Desde una subclase no se puede acceder a las propiedades privadas de la superclase.

Podemos usar protected para acceder desde la subclase a una propiedad de la superclase, pero no permitir su acceso desde otros lugares.

Public: permite acceder a propiedades y métodos desde cualquier sitio (miembros y clases)
Protected: permite acceder desde dentro de la clase y sus subclases. (miembros)
Private: solo permite desde la propia clase. (miembros)
Internal: solo permite acceder desde el mismo paquete (miembros y clases)

* miembro: propiedades y métodos

Atributos de clase

final
dynamic
internal
public

El atributo final se usa para que no se pueda heredar de una clase.
Dynamic indica que esa clase puede tener propiedades dinámicas (ej. Object, MovieClip).

LOS MÉTODOS Y PROPIEDADES ESTÁTICOS NO SE HEREDAN

Override
Si creamos un método en la subclase con el mismo nombre que en la superclase nos sale un error para evitar problemas.
Para sobreescribir un método de la superclase tenemos que marcarla como override en la subclase, después podremos ejecutar el código del método de la superclase escribiendo super.

Actionscript:

public override function metodo() : void
{
trace("Método de la clase base");
}

Si además queremos que se ejecute el código de la clase superior al hacer el override podemos usar super.
Para poder ocultar un método con override el método debe tener la misma firma que la superclase (exacta).

Actionscript:

public override function metodo() : void
{
super.metodo();
trace("Método de la subclase");
}

Cuando hablamos de herencia podemos decir: "Es un..."
Ej. Un Ferrari es un deportivo que a su vez es un coche

Donde utilizamos una superclase podemos usar una subclase.