Conociendo Flex

.

Flex es un framework de Adobe, especializado y optimizado para el diseño de aplicaciones Flash de tipo RIA (Internet Rich Applications). Una aplicación Flex corre autónomamente o en un browser ( extensión swf) si posee el plugin de Flash. Es una evolución del entorno Flash tradicional, más orientado a animaciones y presentaciones, en Flex se realizan desarrollos orientados a la programación web tradicional.

El Framework de Flex  se distribuye de forma gratuita, esto permite que cualquier usuario, una vez instalado el SDK, pueda editar y correr sus programas en cualquier editor de textos. Con Flex, de forma alternativa, se distribuye  de forma paga un  IDE (basado en Eclipse) que lleva por nombre "Flex Builder". 

Un primer ejemplo

Un primer ejemplo (original de Pete Freigtag) permite ilustrar las potencialidades de Flex. Se trata de un utilidad destinada a leer los últimos pots de un blog, vía su canal de RSS. Para ello se diseño la siguiente interfase:

Los elementos utilizados son:

- "Panel" contenedor que habilita un área gráfica de pantalla para disponer otros elementos.

- "DataGrid" control que muestra información en forma de grilla de datos, cada línea corresponde a una entrada en el blog.

- "TextArea" control que habilita un área de texto donde se muestra el contenido de la entrada sobre la cual se está realizando foco.

- "Buttom" Control tipo botón que dispara el evento de lectura del canal RSS remoto.

Código fuente de la aplicación descripta:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  layout="absolute">


<mx:HTTPService id="httpRSS" url="http://ferbor.blogspot.com/rss.xml" resultFormat="object" />

<mx:Panel id="reader" title="Lector de Blogs" width="800" height="450">

  <mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.lastResult.rss.channel.item}"
              click="{body.htmlText=httpRSS.lastResult.rss.channel.item[entries.selectedIndex].description}">

    <mx:columns>
      <mx:Array>

        <mx:DataGridColumn dataField="title" headerText="Titulo" />
        <mx:DataGridColumn dataField="pubDate" headerText="fecha" />

      </mx:Array>
    </mx:columns>
  </mx:DataGrid>

  <mx:TextArea id="body" editable="false" width="{reader.width-15}" height="200" />
  <mx:Button label="Cargar entradas" click="{httpRSS.send()}" />

  
</mx:Panel>
</mx:Application>


Lo primero que se declara en el programa es su definición propiamente dicha, la cual se la hace con la marca  "mx:Application", la cual indica que la aplicación va a ser corrida en un browser. Luego se define el servicio HTTP de donde se van a tomar las últimas entradas del blog, esto se hace con el componente "mx:HTTPService". Ahora se define una grilla, con el control DataGrid, donde se acomodarán las entradas del blog, en una columna el título y en la otra la fecha de creación.  En el área de texto se muestra el contenido de la noticia sobre la cual se hace foco en la grilla de datos, para ello se usa el control "mx:TextArea", finalmente un boton tiene asociado un disparador de la lectura del canal RSS.

Direcciones útiles

API Flex de ESRI

Ejemplos de la API Yahoo Maps y Flex

Ejemplo de mapamundi hecho con flex