Variables globales en Actionscript 3
Actionscript 3, no tiene un acceso tan claro a _root como las versiones anteriores, y _global fue removido (por suerte), por lo tanto se puede llegar a complicar el uso de variables "globales", en realidad no era una buena práctica, pero era una opcion viable hacer esto:
_root.userType = "admin";
o lo siguente:
_global.userType = "admin";
Repito, no es la mejor opción pero era una salida.
La mejor opción para esto, en Actionscript 3, es utilizar el patrón de diseño Singleton, utilizando una class como la siguiente:
[Bindable]
public class GlobalVars {
// public vars:
public var user:String = "nombre de usuario";
public var userType:String = "admin";
// private vars
private static var instance:GlobalVars;
public function GlobalVars() {
}
public static function getInstance():GlobalVars {
if (instance == undefined) {
instance =new GlobalVars();
}
return instance;
}
}
}
Esta class no se debe instanciar dentro de ella está contenida la única instancia, y es pedida con el método getInstance(), así aseguramos la persistencia de las variables dentro de esta misma instancia.
Con esto desde cualquier class de nuestro proyecto, o bien desde algún fotograma del archivo fla podemos utilizar o modificar estas variables de la siguiente forma:
GlobalVars.getInstance().user = "soy el nuevo usuario"
En otra class:
Con esto tendremos variables globales en forma en forma ordenada, porque todas estarán declaradas en nuestra class, además podemos tener más de una class de estas, para almacenar distinto tipos de datos.
Esto sería como una mezcla de los Value Objects y los Model Locators en el Framework Cairngorm, solo que más simplificado para ser utilizado más facillmente.
Más de Flash CS3
Mi post anterior sonó medio "apocalíptico" sobre diseñadores y actionscript.. pero por lo que estuve viendo de Flash CS3 tiene una ventaja, haciendo dobleclick sobre cualquier instancia de componente de Flash en en escenario aparece algo parecido a esto:
Ahi vemos todos las partes del skin del componente para poder ser editado fácilmente... sin tanto código para cambiarlo de colores. Ningún secreto pero es buenisimo..
Flash CS3 ¿Como convivimos?
Como ya todos saben Adobe ha sacado la nueva version de Flash, CS3 (el resto de los programas de adobe también están incluidos en esta version).
La principal novedad que rescato es de Actionscript 3. Tiene mejoras excelentes, y cosas nuevas que empecé a utilizar en Flex 2 y aun descubriendo para Flash.
Lo que veo un poco complicado esa la convivencia Programador-Diseñador, AS3 tiene algunos cambios que pueden llegar a afectar a personas que no estén muy acostumbradas a trabajar con código:
- No se puede poner codigo sobre los objetos (no mas on(release) )
- No mas getURL (creo que lo primero qeu se aprende de Actionscript)
- No está ni _root ni _parent
- No mas #include
- Es más estricto, no se puede hacer un casting de variable sin declararlo
- Si se asignan propiedades a objetos nulos, da error
Bueno, eso entre otras cosas. Creo que con todo esto va a ser dificil que un diseñador flash utilice Actionscript 3, con esto pueden pasar dos cosas, o bien que los diseñadores se dediquen a la parte gráfica exclusivamente, separado del código del programador, o bien que el diseñador haga sus "programaciones" en AS1, o AS" y que luego el programador tenga que pasar todo a AS3.
Creo que de las dos opciones me quedo con lo primero, vamos a ver como evoluciona esto, como siempre digo, la tecnología es buenísima, ideal; el conflicto está en las personas que la deben utilizar.
Mini-FAQ sobre Flex 2
Hace tiempo que vengo hablando sobre Flex 2, posteando ejemplos y otras cosas salteándome cualquier tipo de introducción. Ultimamente recibí varias consultas de desarrolladores que quieren conocer Flex, por eso armé algunas consultas comunes y armé este pequeño FAQ.
¿Para que sirve Flex?
Básicamente Flex está pensado para el desarrollo de RIAs (Rich Internet Applications), o sea aplicaciones Web con elementos de formulario, interacciones avanazadas, conexión a base de datos.
¿Como es la forma de trabajar en Flex?
En resumen, son archivos XML (MXML) donde se encuentran las llamadas a los componentes, estados, vistas, etc. Los componentes pueden ser desarrollados por Adobe, o componentes propios. La programacíón se realiza en Actionscript 3, y estos códigos se colocan en archivos .as.
¿Como se realiza la compilación de los proyectos?
Básicamente hay dos formas, en tiempo de ejecución en un Flex Server o con el SDK de Adobe. En el Flex Server se suben los archivos .mxml y desde el browser se visualizan archivos swf. Una analogía conocida sería, se suben PHP y se visualizan HTML, este servidor está basado en Java. La otra es compilando los mxml con el SDK y subir directamente los archivos SWF.
¿Donde puedo conseguir el SDK?
El SDK se puede bajar del sitio de Adobe y es gratis.
¿Hay alguna herramienta para desarrollar Flex 2?
Si, se puede utilizar el Flex Builder 2, este es un plug-in para Eclipse que tiene asistentes muy útiles para la codificación, y también tiene una interfáz para el desarrollo visual.
Para ejecutarse, del lado cliente, ¿se necesita lago más que el FLASH Player?
No, se necesita tener instalado el Flash Player 9. Y es compatible con cualquier navegador que tenga esa versión de Flash Player.
¿Que tecnología de servidor debo utlizar para trabajar con Flex y base de datos?
Cualquiera, PHP, ASP, .NET, JSP, cualquier tipo de tecnología de servidor, utilizando Flash Remoting, XML, WebServices, WebOrb, etc.
Bueno, eso es todo por ahora, es muy básico pero espero que sirva para aclarar algunas dudas 
Cualquier cosa que quieran agregar o corregir no tienen mas que ponerlo en los comentarios.
Flex DirBrowser Component
Este componente es una mejora del componente File Upload que publiqué anteriormente.
Es simple, explora un directorio que se le pasa como parámetro, lista todos los archivos están en ese directorio, se pueden borrar y agregar nuevos archivos. Está pensado para imágenes.
Ejemplo
Flex Sources
Descargar todos los archivos
Guía de migración de Actionscript 2 a 3
En actionscriptcheatsheet publicaron una guía de migración de Actionscript 2 a 3.
Imperdible, una referencia para tener en cuenta.
Upload de archivos con Flex 2
En estos días estoy haciendo un admin para un sitio web, estoy utilizando Flex con PHP y MySQL. Esta herramienta me está simplificando mucho las cosas, lo que antes eram varios xhtmls otros tantos php y si queremos que quede mas usable otros muchos js para hacer un ajax, hoy son solo unas 50 lineas en un mxml y otro poco de código en Actionscript. Trabajando, me topé con un problema, hacer un upload de archivos con Flex, mucha info no encontré en internet, así que me las arreglé bastante solo, aquí comparto el resultado, espero que sirva.
Archivo mxml:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal"
creationComplete = "init()">
<mx:Script source="subir.as"/>
<mx:Panel title="Subir Imagen"
paddingBottom="10"
paddingLeft="10"
paddingRight="10"
paddingTop="10">
<mx:Form width="100%" height="100%">
<mx:FormItem label="Imagen">
<mx:Text id="file_path"/>
<mx:ProgressBar id="uploadProgress" label="" mode="manual" />
<mx:ControlBar horizontalAlign="right">
<mx:Button id="browseUpload" label="Buscar..." click="buscar()"/>
<mx:Button id="startUpload" label="Upload..." click="subir()" />
</mx:ControlBar>
</mx:FormItem>
</mx:Form>
</mx:Panel>
</mx:Application>
Archivo Actionscript:
import flash.net.URLRequest;
import flash.net.URLRequestMethod
private const UPLOAD_URL:String = "upload.php";
private var imagesFilter:FileFilter = new FileFilter("Images", "*.jpg;*.gif;*.png");
private var photoShop:FileFilter = new FileFilter("Archivos Photoshop", "*.psd");
private var fileref:FileReference = new FileReference();
private function buscar():void {
fileref.browse([imagesFilter,photoShop]);
}
/**
* cuando se ha seleccionado el archivo coloco el nombre en el text
* y habilito el botón subir
*/
private function seleccionar(event:Event):void {
startUpload.enabled = true;
file_path.text = fileref.name;
}
/**
* subo el archivo
*/
private function subir():void{
var request:URLRequest = new URLRequest();
request.method = URLRequestMethod.GET;
request.url = UPLOAD_URL;
fileref.upload(request);
}
/**
* chequeo el progreso
*/
private function progressHandler(event:ProgressEvent):void {
uploadProgress.setProgress(event.bytesLoaded, event.bytesTotal);
}
private function completeHandler(event:Event):void {
uploadProgress.label = "UPLOAD COMPLETE";
}
/**
* inicializo la applicación
*/
private function init():void{
startUpload.enabled = false;
fileref.addEventListener(Event.SELECT, seleccionar);
fileref.addEventListener(ProgressEvent.PROGRESS, progressHandler);
fileref.addEventListener(Event.COMPLETE, completeHandler);
}
ActionScript 3: XML - RSS Reader
Estoy haciendo varias pruebas con Actionscript 3. Y para probar estoy usando Flex 2, lo que sigue sería mi "Hola Mundo", básico, pero es un avance:
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
public function initApp():void
{
var XML_URL:String ="http://www.cristianhernandez.org/blog/?feed=rss2";
var myXMLURL:URLRequest = new URLRequest(XML_URL);
var myLoader:URLLoader = new URLLoader(myXMLURL);
myLoader.addEventListener("complete", xmlLoaded);
}
function xmlLoaded(evtObj:Event):void {
var loader:URLLoader = URLLoader(evtObj.target);
var externalXML = new XML(loader.data);
for each (var item:XML in externalXML..item) {
var itemTitle:String = item.title.toString();
var itemDescription:String = item.description.toString();
var itemLink:String = item.link.toString();
mainTxt.htmlText += "<p><b>"+itemTitle+"</b><br />"+itemDescription+"</p>";
}
}
initApp():
Y para hacerlo funcionar en Flex, solo hay que pasarlo en un archivo mxml de la siguiente forma:
<mx :Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*"
layout="vertical"
creationComplete = "initApp()" >
</mx><mx :Script>
< ![CDATA[
import flash.events.*;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
public function initApp():void
{
var XML_URL:String = "http://www.cristianhernandez.org/blog/?feed=rss2";
var myXMLURL:URLRequest = new URLRequest(XML_URL);
var myLoader:URLLoader = new URLLoader(myXMLURL);
myLoader.addEventListener("complete", xmlLoaded);
}
function xmlLoaded(evtObj:Event):void {
var loader:URLLoader = URLLoader(evtObj.target);
var externalXML = new XML(loader.data);
for each (var item:XML in externalXML..item) {
var itemTitle:String = item.title.toString();
var itemDescription:String = item.description.toString();
var itemLink:String = item.link.toString();
mainTxt.htmlText += "<p><b>"+itemTitle+"</b><br />"+itemDescription+"";
}
}
]]>
</mx>
<mx :TextArea id = "mainTxt" width="400" height="307"/>
La próxima va con comentarios y más explicado.
Ejemplo (requiere Flash Player 9)