Joan Llenas at Garnet Works :: Thoughts on software development http://joan.garnet.io Thoughts on software development Wed, 14 Nov 2012 10:39:04 +0000 es-ES hourly 1 http://wordpress.org/?v=3.4.2 Subscribe with My Yahoo!Subscribe with FeednessSubscribe with NewsGatorSubscribe with BloglinesSubscribe with NetvibesSubscribe with GoogleSubscribe with PageflakesSubscribe with PlusmoSubscribe with The Free DictionarySubscribe with Bitty BrowserSubscribe with Live.comSubscribe with Excite MIXSubscribe with WebwagSubscribe with Podcast ReadySubscribe with WikioSubscribe with Daily Rotation Apache Flex SDK – installer, mavenizer http://feedproxy.google.com/~r/joan_garnet_io/~3/HKo6xzBbkrU/ http://joan.garnet.io/?p=1904#comments Wed, 14 Nov 2012 10:37:55 +0000 Joan Llenas http://joan.garnet.io/?p=1904 Tal y como dice en la web de Apache: “The Apache Flex SDK Installer is an application that simplifies the download and installation of the Apache Flex SDK and its (required) components. It is aimed at anyone who wants to use the latest release of the Apache Flex SDK, but who might not necessarily be familiar with the tools and procedures required to compile the Apache Flex SDK from source code”.
Apache Flex dispone de un instalador que configura e instala los elementos necesarios para poder crear aplicaciones Flex desde Flash Builder.
Incluso se puede añadir un badge en tu web o blog!

Y para los que quieran utilizar Flex con un build de Maven se dipone de otra herramienta: “In order to be able to use Flex with a maven build, it is crucial to be able to have access to a mavenized form of FDK. The Apache Flex SDK Mavenizer tool is used to convert the Apache and Adobe Flex SDKs and Air SDKs into Maven artifacts. Automatically creating the Directories, pom-files, copying and moving the resources to the correct destinations.”

svn co https://svn.apache.org/repos/asf/incubator/flex/utilities/trunk/mavenizer/ mavenizer

Para más información podéis ir al sitio web de Apache Flex, que por cierto, pronto se va agraduar como proyecto Apache de forma oficial!

]]> http://joan.garnet.io/?feed=rss2&p=1904 0 http://joan.garnet.io/?p=1904 Teleport: diseñado para compartir http://feedproxy.google.com/~r/joan_garnet_io/~3/TXNXwCu_bB8/ http://joan.garnet.io/?p=1882#comments Sun, 21 Oct 2012 22:30:40 +0000 Joan Llenas http://joan.garnet.io/?p=1882 ra tarde ya, una de esas noches invernales tan normales de principios de semana, un martes probablemente.
El toque disonante lo dábamos un grupo de geeks saliendo de las torres Mapfre. Salíamos de un “9IT”. Habíamos sido convocados por Xavi Beumala para celebrar una nueva edición del evento “9IT”, unas reuniones clandestinas organizadas para compartir conocimientos entre colegas.

Saliendo de allí, tras despedirnos de todos invité a Raúl a llevarle a casa. No me venía de camino pero el tramo sería suficiente para poder comentar la jugada y también para actualizarnos en nuestros temas clásicos: series, pelis, tecnología, a dónde vamos, de dónde venimos, el pollo a la cerveza….

Fue en ese trayecto cuando Raúl me habló por primera vez acerca de Teleport.
- Teleport sería una aplicación para poder transferir archivos entre dispositivos vía peer-to-peer.

Teleport – The best way to share content from Teleport Team on Vimeo.

Era un proyecto que quería para él mismo, en ese momento no había ninguna pretensión de crear un producto ni nada por el estilo, era un “proyecto mascota” que compartiría con su circulo de amigos para pasarse archivos y que, más que seguro, pasaría a ser material para dar una charla en alguno de los eventos tecnológicos de la temporada.

En aquél momento no le di demasiada importancia, fue en sucesivos encuentros posteriores que capté el potencial de la idea.
- No se trata de inventar algo nuevo, se trata de tener una necesidad y darle una solución, aunque sea re-definiendo sutilezas en un sistema ya existente o juntando varios sub-sistemas para formar uno nuevo, con un sentido diferenciado.

A la gente le gusta compartir, esto es un hecho, lo que es sorprendente es la fragmentación en las formas de hacerlo y la dificultad que alberga el hacerlo.
Teleport pretende democratizar la compartición de contenidos.
Puedes creértelo o no, puedes contribuir o no, lo que seguro que vas a hacer es usarlo cuando esté disponiible.

Teleport – User Interface Sneak Peek from Teleport Team on Vimeo.

Para ver en detalle qué es Teleport puedes acceder a la web de la campaña que hemos lanzado en indiegogo.com, donde estamos financiando el proyecto a través de las contribuciones de los usuarios que están interesados en ver el proyecto hecho una realidad.
Otros proyectos han llegado a ver la luz gracias a esta forma de financiación, y lo han hecho pudiendo mantener al 100% su idea original, sin filtros, sin censuras.
Ayúdanos a hacer Teleport una realidad adquiriendo alguno de los paquetes que hemos creado especialmente para la campaña.

Este es el ritual de iniciación para llegar a ser un Teleporter:

  1. Adquirir uno de los paquetes de Indiegogo: http://www.indiegogo.com/teleport
  2. Darse de alta en la newsletter desde nuestro sitio web: http://www.teleport.io
  3. Dejar un “Me gusta” en nuestra página de Facebook: http://www.facebook.com/TeleportApp
  4. Dejar un “Me gusta” en alguno de nuestros videos en Viemo: https://vimeo.com/teleportio
  5. Seguirnos en Twitter: https://twitter.com/teleport/
  6. Haznos saber que has completado todos los pasos a través de hello [arroba] teleport [punto] io. Algo haremos contigo! ;-)

Gracias!

]]> http://joan.garnet.io/?feed=rss2&p=1882 2 http://joan.garnet.io/?p=1882 ¡10 años de Subflash! – Taller videojuegos http://feedproxy.google.com/~r/joan_garnet_io/~3/PDo6Cuq9EnA/ http://joan.garnet.io/?p=1866#comments Thu, 05 Jul 2012 21:13:32 +0000 Joan Llenas http://joan.garnet.io/?p=1866 Un año más, Subflash llega en punto a su cita veraniega y como cada año haré las maletas y me acercaré al paraje al que nos lleve.
Este año, ni más ni menos que en la décima cita de éste entrañable evento, nos vamos a Vigo!
Para no reescribir lo que ya he mencionado años pasados resumiré: ¡No te lo pierdas!

Uno de los obvios atractivos de Subflash son sus talleres de programación, diseño, animación, etc… que tanto nos gustan a los geeks. Talleres de geeks, para geeks. Todo queda en casa :)
Bueno, pues este año tengo la oportunidad de dar uno! (gracias Marcos por no aburrirte de mi) y este año me voy a salir un poco del guión y voy a derivar hacia el desarrollo de videojuegos, tema que me ha despertado el interés últimamente dada la gran exposición que los juegos tienen a través de dispositivos mobiles.
La charla la enfocaré hacia el desarrollo de casual games, que un campo muy asequible para los que nos hemos dedicado durante años al desarrollo de aplicaciones visuales y a su vez tenemos interés por los videojuegos.

Dejo unos enlaces referentes al registro al evento y otros datos de interés:

]]> http://joan.garnet.io/?feed=rss2&p=1866 2 http://joan.garnet.io/?p=1866 Apache Flex logo http://feedproxy.google.com/~r/joan_garnet_io/~3/vfYjPF17wFg/ http://joan.garnet.io/?p=1855#comments Thu, 09 Feb 2012 23:41:25 +0000 Joan Llenas http://joan.garnet.io/?p=1855 Flex ya tiene un nuevo logo, escogido por la comunidad mediante voto.

El logo está en diferentes formatos, de momento disponibles desde el JIRA issue al respecto.

]]> http://joan.garnet.io/?feed=rss2&p=1855 1 http://joan.garnet.io/?p=1855 Información detallada acerca de Apache Flex http://feedproxy.google.com/~r/joan_garnet_io/~3/Sn6c6xcGv9U/ http://joan.garnet.io/?p=1847#comments Mon, 19 Dec 2011 13:35:20 +0000 Joan Llenas http://joan.garnet.io/?p=1847 Un montón de cosas están pasando alrededor del anuncio de Adobe de donar Flex a la Apache Software Foundation.
No voy a tratar de resumir el estado del proceso de transición, en cambio voy a apuntar a un enlace que resume muy bien todo lo sucedido los últimos días.

]]> http://joan.garnet.io/?feed=rss2&p=1847 0 http://joan.garnet.io/?p=1847 Parsley Task Commands http://feedproxy.google.com/~r/joan_garnet_io/~3/f-4OLkBwTa4/ http://joan.garnet.io/?p=1833#comments Sun, 18 Dec 2011 17:17:35 +0000 Joan Llenas http://joan.garnet.io/?p=1833 Parsley permite crear Commands que devuelven cualquier cosa. Por defecto se soporta void, AsyncToken y Task, siendo éste último tipo de datos el menos popular y desconocido. Provablemente porque no hay documentación al respecto, solo una mención de la posibilidad de hacerlo.
A continuación una explicación y un pequeño ejemplo de cómo crear un DynamicCommand que devuelve y controla el transcurso de un Task.

La primera clave para que la funcionalidad llegue a procesarse es inicializar el contexto con soporte de TaskCommands.

PLAIN TEXT
MXML:
  1. <fx:Declarations>
  2.     <parsley:ContextBuilder>
  3.         <parsley:TaskCommandSupport/>
  4.         <parsley:FlexConfig type="{ Context }"/>
  5.     </parsley:ContextBuilder>
  6. </fx:Declarations>

La segunda es obviamente crear un Command cuyo método execute() devuelva Task.
Y la tercera que el método de retorno tenga el primer argumento de tipo Task, ya que ésto es lo que el procesador de TaskCommands devuelve.

PLAIN TEXT
Actionscript:
  1. package {
  2.     import org.spicefactory.lib.task.Task;
  3.     public class MyTaskCommand
  4.     {
  5.         public function execute(msg:MyMessage):Task
  6.         {
  7.             var myTask:Task = new MyTask();
  8.             return myTask;
  9.         }
  10.  
  11.         public function result(tsk:Task, msg:MyTask):void
  12.         {
  13.         }
  14.     }
  15. }

En el ejemplo que muestro a continuación se puede ver cómo implementar un DynamicCommand que realiza una operación de suma con un número indeterminado de operandos. La clave es utilizar un SequentialTaskGroup dentro de un Command que al completarse permite conocer el resultado gracias a la integración del Command con el Task.

Descarga ejemplo

En el zip hay un proyecto Flex4 para Flash Builder.
Parsley Task Commands (141) - 473.33 kB

Más info

]]> http://joan.garnet.io/?feed=rss2&p=1833 0 http://joan.garnet.io/?p=1833 Auto versionado de aplicaciones con Flash Builder http://feedproxy.google.com/~r/joan_garnet_io/~3/VMvwiXjmJDM/ http://joan.garnet.io/?p=1774#comments Fri, 02 Sep 2011 18:51:37 +0000 Joan Llenas http://joan.garnet.io/?p=1774 Flash Builder 4.X se distribuye integrado con Apache Ant, una herramienta para la automatización de procesos de compilación.
Esto nos permite utilizar todo su potencial para crear todo tipo de runtinas que complementen o incluso sustituyan el build predeterminado que realiza Flash Builder.
Ya seas desarrollador Flex o ActionScript es posible que le encuentres un uso a ANT, desde mover archivos al ser compilados, subirlos automáticamente al ftp o incluso añadir de forma automática un número de versión o fecha de compilación al swf resultante.
En esta entrada mostraré precisamente esto, cómo crear un pequeño script ANT que automatize el versionado de una aplicación en cada compilación.

El archivo de propiedades

PLAIN TEXT
Properties:
  1. # Ruta al jar de flexTasks, incluído al instalar Flash Builder
  2. FLEX_TASKS=C:/Program Files (x86)/Adobe/Adobe Flash Builder 4.5/sdks/4.5.1/ant/lib/flexTasks.jar
  3.  
  4. # Ruta al archivo que se utiliza como template para la clase Version
  5. VERSION_FILE_TEMPLATE=versionBuilderAssets/Version.as.template
  6.  
  7. # Ruta al archivo de la clase Version real (se sobreescribe a cada compilacion)
  8. VERSION_FILE_DESTINATION=src/io/joan/garnet/Version.as
  9.  
  10. # Parametros de version (modificar cuando se quiera cambiar de version)
  11. MAJOR=0
  12. MINOR=1
  13. PATCH=0
  14.  
  15. # El formato de fecha que se utiliza para generar el parametro build de la version
  16. BUILD_TIME_FORMAT=yyyyMMddHHmm

La tarea Ant

PLAIN TEXT
XML:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <project name="Version Builder" basedir="." default="main">
  3.     <property file="versionBuilderAssets/versionBuilder.properties" />
  4.     <taskdef resource="flexTasks.tasks" classpath="${FLEX_TASKS}" />
  5.     <target name="main">
  6.         <tstamp>
  7.             <format property="BUILD_TIME" pattern="${BUILD_TIME_FORMAT}" />
  8.         </tstamp>
  9.         <copy file="${VERSION_FILE_TEMPLATE}" tofile="${VERSION_FILE_DESTINATION}" overwrite="true" />
  10.         <replace file="${VERSION_FILE_DESTINATION}" token="@major@" value="${MAJOR}" />
  11.         <replace file="${VERSION_FILE_DESTINATION}" token="@minor@" value="${MINOR}" />
  12.         <replace file="${VERSION_FILE_DESTINATION}" token="@patch@" value="${PATCH}" />
  13.         <replace file="${VERSION_FILE_DESTINATION}" token="@buildtime@" value="${BUILD_TIME}" />
  14.         <echo message="Build version number:${line.separator}Major: ${MAJOR}${line.separator}Minor: ${MINOR}${line.separator}Patch: ${PATCH}${line.separator}Build: ${BUILD_TIME}"/>
  15.     </target>
  16. </project>

El template del archivo de versión

PLAIN TEXT
Actionscript:
  1. package io.joan.garnet
  2. {
  3.     import mx.utils.StringUtil;
  4.  
  5.     public class Version
  6.     {
  7.         public static var MAJOR_VERSION:uint = @major@;
  8.         public static var MINOR_VERSION:uint = @minor@;
  9.         public static var PATCH:uint = @patch@;
  10.         public static var BUILD_TIME:String = "@buildtime@";
  11.        
  12.         public static function toString():String
  13.         {
  14.             return StringUtil.substitute("v{0}.{1}.{2} build.{3}", MAJOR_VERSION, MINOR_VERSION, PATCH, BUILD_TIME);
  15.         }
  16.     }
  17. }

Enlazar la compilación con la tarea Ant

Para que cada vez que compilamos se ejecute la tarea Ant antes de la compilación de Flex debemos agregar un nuevo Builder desde las propiedades del proyecto.
builders builders2 Ant Tasks

Descarga ejemplo

En el zip hay un proyecto Flex4 para Flash Builder.
Auto Version Build (273) - 25.8 kB

Más info

]]> http://joan.garnet.io/?feed=rss2&p=1774 0 http://joan.garnet.io/?p=1774 Dibujando en un Chart component http://feedproxy.google.com/~r/joan_garnet_io/~3/H9sdLkxPrJ0/ http://joan.garnet.io/?p=1759#comments Fri, 03 Jun 2011 21:44:31 +0000 Joan Llenas http://joan.garnet.io/?p=1759 Los charting components de Flex vienen con un montón de funcionalidad implementada que cubre la mayor parte de las necesidades que se pueden tener de cara a crear visualizaciones. Además de eso si se indaga un poco más en profundidad en su arquitectura también veremos que disponemos de algunos hooks muy interesantes a la hora de cubrir necesidades un poco más extravagantes fuera de lo que está implementado.

Concretamente estoy hablando de los backgroundElements y los annotationElements:

PLAIN TEXT
XML:
  1. <mx:AreaChart>
  2.     <mx:backgroundElements />
  3.     <mx:series />
  4.     <mx:annotationElements />
  5. </mx:AreaChart>

En el código anterior podemos apreciar que el componente expone las dos propiedades, que son de tipo Array y aceptan cualquier subclase de ChartElement.

A la hora de implementar algo que funcione en el contexto de una determinada visualización debemos tener en cuenta que al posicionar los elementos vamos a necesitar hacer conversiones entre dimensiones espaciales. Esto es, nosotros solo entendemos valores absolutos para 'x' e 'y', en cambio la visualización trabaja con otro tipo de valores, ya sean numéricos, fechas, nombres, etc..
En este punto es cuando damos gracias por encontrar un par de joyas incluídas en el charting framework en lo que se refiere a abstraernos de dichas conversiones. Concretamente hablo de las clases CartesianDataCanvas y PolarDataCanvas.

Ambas clases sirven para lo mismo. Son un lienzo en blanco sobre el cuál nosotros podemos dibujar sin tener que preocuparnos de realizar la dura tarea de transformar coordenadas.
La diferencia principal entre las dos es que CartesianDataCanvas se utiliza para charting components que utilizan coordendas cartesianas (LineChart, BarChart, ColumnChart...) y PolarDataCanvas para charting components que utilizan coordenadas polares (PieChart).

Un ejemplo de utilización de la versión cartesiana:

La clave para conseguir esto es la clase CartesianDataCanvas y la utilización de su método addDataChild(), que permite añadir un elementos en una posición parametrizada con valores del mismo tipo que los que disponemos en los data points.

Descarga ejemplo

En el zip hay un proyecto Flex4.5 para Flash Builder.

Drawing whithin charts (288) - 1.56 MB
zip
]]> http://joan.garnet.io/?feed=rss2&p=1759 0 http://joan.garnet.io/?p=1759 Sticky Selection DataGrid (múltiple sin CTRL) http://feedproxy.google.com/~r/joan_garnet_io/~3/mTxRhN78to8/ http://joan.garnet.io/?p=1748#comments Wed, 06 Apr 2011 15:50:30 +0000 Joan Llenas http://joan.garnet.io/?p=1748 Tener que selecciona múltiples filas en un DatGrid presionando CTRL es algo que muchos usuarios pueden encontrar complicado. En estos casos una solución es habilitar un tipo de interacción en el que usuario solo tenga que clicar a las filas como si de ComboBox se trataran: un click selecciono, otro click deselecciono. Fácil y usable.
Para Flex4 es realmente sencillo conseguir este efecto, solo se tiene que sobreescribir un método.

PLAIN TEXT
Actionscript:
  1. package io.garnet.joan.controls.datagrid
  2. {
  3.     import mx.controls.DataGrid;
  4.     import mx.controls.listClasses.IListItemRenderer;
  5.  
  6.     public class DataGridStickySelection extends DataGrid
  7.     {
  8.         override protected function selectItem(item:IListItemRenderer, shiftKey:Boolean,
  9.                                                ctrlKey:Boolean, transition:Boolean = true):Boolean
  10.         {
  11.             return super.selectItem(item, false, true, transition);
  12.         }
  13.     }
  14. }

Luego no podemos olvidar setear el valor allowMultipleSeleciont a true en la declaración:

PLAIN TEXT
Actionscript:
  1. <datagrid:datagridstickyselection width="100%" height="100%"
  2.     allowMultipleSelection="true"
  3.     dataProvider="{ model.dataProvider }">
  4.     <!-- (...) -->
  5. </datagrid:datagridstickyselection>

Un ejemplo (click derecho: view source)

]]> http://joan.garnet.io/?feed=rss2&p=1748 1 http://joan.garnet.io/?p=1748 Embed de fuentes *.dfont y *.ttc con Flex4 http://feedproxy.google.com/~r/joan_garnet_io/~3/lmjlh0SXAnY/ http://joan.garnet.io/?p=1723#comments Tue, 08 Mar 2011 17:19:09 +0000 Joan Llenas http://joan.garnet.io/?p=1723 Normalmente incrustamos fuentes en formato independiente *.ttf y *.otf pero si se da la necesidad también podemos incrustar fuentes en formato contenedor *.dfont o *.ttc.
Mediante CSS es posible hacerlo de la siguiente forma:

PLAIN TEXT
CSS:
  1. @font-face {
  2.     src: url("Helvetica.dfont");
  3.     fontFamily: "Helvetica Regular";
  4.     fontStyle: normal;
  5.     fontWeight: normal;
  6.     embed-as-cff: true;
  7. }
  8. @font-face {
  9.     src: url("Helvetica.dfont");
  10.     fontFamily: "Helvetica Bold";
  11.     fontStyle: normal;
  12.     fontWeight: bold;
  13.     embed-as-cff: true;
  14. }

El procedimiento es el mismo que cuando embebemos una fuente *.ttf pero hay una punto a tener en cuenta, el atributo fontFamily debe ser exactamente el mismo que el nombre de la fuente incluyendo el estilo al que pertenece, es decir Bold, Oblique, Light, Regular, etc...

En el visor de fuentes de sistema se puede obtener esa información, por ejemplo en OSX se ve como en la imagen de la izquierda.
Por supuesto cualquier otro atributo que utilizado con fuentes individuales se puede utilizar para fuentes en formato contenedor, al fin y al cabo el compilador de Flex lo único que hace es extraer del contenedor las fuentes individuales que se utilizan y las incrusta en el bytecode del archivo swf.
Para utilizar la tipografía en otras declaraciones CSS se opera como con cualquier otra fuente individual:

PLAIN TEXT
CSS:
  1. @font-face {
  2.     src: url("Helvetica.dfont");
  3.     fontFamily: "Helvetica Bold";
  4.     fontStyle: normal;
  5.     fontWeight: bold;
  6.     embed-as-cff: true;
  7. }
  8. s|Button{
  9.     font-family: "Helvetica Bold";
  10. }

Dejo un ejemplo de uso para la fuente Helvetica completa empaquetada como *.dfont:

Descarga ejemplo

En el zip hay un proyecto Flex4 para Flash Builder.

Embed de fuentes formato *.dfont (363) - 774.32 kB
zip
]]> http://joan.garnet.io/?feed=rss2&p=1723 0 http://joan.garnet.io/?p=1723