Cómo parchear el Framework de Flex


Alguna vez te has encontrado en la situación de tener que modificar todos los controles que usa tu aplicación por un bug en la clase UIComponent? Si es así, estás en el sitio correcto para aprender cómo corregir el framework de Flex y así solucionar de raiz el problema.

Antes de empezar, he de advertir que, además de las ventajas que pueda aportar el corregir un bug concreto, tendremos efectos colaterales no tan beneficiosos pero, a veces, aceptables; todo dependerá básicamente de evaluar el ratio beneficio/desventaja para un escenario concreto.

  1. Tenemos el source del Framework de Flex
  2. Tenemos el script de ANT para compilar el framework!
  3. Modificar el Framework, con cuidado!
  4. Recompilar el Framework
  5. Utilizar el nuevo Framework
  6. Resultado
  7. Observaciones

Tenemos el source del Framework de Flex

Si alguna vez habéis inspeccionado el plugin de Flex para Eclipse, habréis podido notar que, dentro de la carpeta de instalación de mismo, normalmente en C:\Archivos de Programa\Adobe\Flex Builder 2.X Plug-in, podréis encontrar una carpeta llamada

Flex SDK 2\frameworks\source

Pues bien, dentro de esa carpeta está todo el source del SDK de Flex; esto es un detallazo por parte de Adobe, no sólo porque nos va a permitir generarnos nuestro propio framework parcheado sino porque supone un resource documental bestial a la hora de entender el framework, su arquitectura de componentes, etc.

Tenemos el script de ANT para compilar el framework!

Dentro de la carpeta raíz de instalación del plugin podréis encontrar diferentes ficheros. Entre ellos, uno llamado build_framework.xml que corresponde a un script ANT para la compilación del framework como muestra el siguiente screenshot:

framework_files.png

Ahora que tenemos localizado todos los elementos necesarios para generar nuestra propia versión del framework, vamos a hacer un pequeño cambio ( a modo de ejemplo ) y, seguidamente, vamos a pasar a regenerar el framework y a ver cómo se utiliza en nuestro proyecto Flex.

Modificar el Framework, con cuidado!

No sé si lo he apuntado antes pero la modificación de cualquier clase del framework de Flex exige un cierto conocimiento de lo que se está haciendo porque, de lo contrario, la modificación puede acarrear consecuencias impredecibles dentro del funcionamiento de nuestra aplicación.

A modo de ejemplo, voy a hacer un minúsculo cambio en la clase UIComponent que afectará, directamente, a todos los componentes visuales del framework, ya que todos ellos utilizan UIComponent como clase base.

En la última versión oficial de Flex, en la próxima tengo entendido que está corregido, si defines un errorString=”" ( en ciertas circumstacias ) para cualquier control, aparece un borde negro bastante molesto a la vista. Para solucionar esto, vamos a añadir 1 sóla linea, que ni voy a comentar, al código fuente de UIComponent y vamos a arreglar el problema.

Definimos un proyecto Flex básico nuevo que va a tener todo el código del framework, quedaría algo así:

framework_project.png

Editamos el fichero UIComponent.as que se encuentra en la ruta:

\mx\core\UIComponent.as

Localizamos la función que dibuja el borde al definir un errorString dado, en este caso se llama “setBorderColorForErrorString()”
Nos estudiamos un poco el código, localizamos que existe un problema en las primeras lineas y lo corregimos:

Versión original:

Versión modificada:

Recompilar el Framework

Ahora localizamos, dentro del proyecto del framework, el script ANT de compilación y lo ejecutamos como ANT build:

framework_build.png

En la pantalla siguiente, seleccionaremos sólo el target build-framework:

framework_target.png

Seguidamente lo ejecutaremos y, después de unos segundos, obtendremos nuestra versión del framework ( framework.swc ) en el directorio de salida, por defecto el:

\frameworks\libs\framework.swc

Utilizar el nuevo Framework

Ahora únicamente nos queda sobreescibir el framework original por el nuestro y ya está!

Para eso, copiamos el nuevo framework.swc en la carpeta donde lo va a buscar Eclipse, por defecto en:

C:\Archivos de Programa\Adobe\Flex Builder 2.X Plug-in\Flex SDK 2\frameworks\libs

Resultado

Aquí tenemos 2 aplicaciones Flex: una generada usando el framework original y la segunda utilizando nuestro framework modificado.

En la primera, al hacer clic sobre el botón, el control muestra un border negro.

Aplicación con el framework original

En la segunda, este problema esta solventado gracias a nuestro “parche”.

Aplicación con el framework modificado

Observaciones

  • Al estar modificando el framework original, cada vez que Adobe saque un nuevo release tendremos que repasar todos nuestros cambios. Esto supone un mantenimiento extra asociado.
  • Hay que invertir tiempo en entender como funcionan las clases que estamos tocando.
  • Quizás haya gente que se anime a utilizar esta técnica ahora que Adobe ha anunciado que liberaliza el SDK.
    • Comparte:



    7votos  Vota!!

    Acerca de esta entrada

    Usted está leyendo “Cómo parchear el Framework de Flex,” una entrada de MadeInFlex

    Autor: Alberto Albericio




    Alberto es un arquitecto de aplicaciones web especializado en Rich Internet Applications basadas en Flex y Ajax. Actualmente trabaja desarrollando software en Codeoscopic como Jefe de Proyecto.
    URL del Autor:
    http://www.codeoscopic.com
    Ver
    otras entradas del autor
    Publicada:
    16.05.07 / 3pm
    Categorías:
    Artículos, Flex Builder, Tips
    Entradas relacionadas:
  • AIR 1.1 y AIR Update Framework
  • FDS Stress Testing Framework
  • Clear Toolkit framework
  • Guasax estrena web
    • Número de visitas:
    3505