Hablando con Joseba sobre el bug del columnador que se comenta en los comentarios del post anterior nos hemos dado cuenta que el renderizado de las imágenes falla con el player 8 y no con el 7.

Lo que aparentemente parece que solo falle en Firefox no es así, falla tanto en IE como en FF. Para reproducirlo en IE no es tan directo como en FF. Los pasos a seguri son:

• Cargar la página del componente.url
• Hacer scroll hasta la posición del swf
• Limpiar la cache
• Recargar la página

Yo siguiendo este procedimiento puede reproducir el error en IE. En FF el bug se reproduce tal cual.

Por lo abstracto del problema intuyo que es problema del sitema de bitmapCaching del nuevo player. Cuando se cargan los datos en html con las imágenes embedidas aún no se han cargado las css's, por lo que la posición de las imágenes es una. Al cargarse las css's las imágenes tienen que desplazarse pq el texto es más alto, al redibujarse las imágenes no se eliminan las que ya estaban cargadas.

Un ejemplo más reducido del bug. Para reproducirlo tantno en IE como en FF pulsar 2 veces en el boton 'load css' (la cache del navegador limpia).

Descargar código de ejemplo.

En fin, es sólo una suposición y tendremos que esperar a la release final del player. De momento ya lo he notificado en el bug tracking del player 8. A ver si lo arreglan...

Permalink Comments (11)

Fruto de los talleres SubFlash, Elecash y Dani implementaron una clase para maquetar en formato columnas un texto dado. La verdad es que me cayó muy simpático el componente y me dio por adaptarlo al formato de componentes de flash. Después de un intercambio de mails con Elecash hemos ampliado sus funcionalidades para que también pueda renderizar html y hemos hecho una refactorización del código. El último paso ha sido cear un paquete mxp para facilitar su distribución.

El código lo podéis descargar, modificar a vuestro antojo y utilizarlo donde os haga falta (proyectos comerciales incluidos). Si no queréis el codigo y simplemente lo queréis utilizar, podéis descargar la extensión instalable. Los links para las descargas están al final del post.

El uso es muy intuitivo, si lo queréis usar desde la linea de tiempo simplemente lo tenéis que arrastrar y rellenar las propiedades.

Por otro lado si lo queréis incrustar desde código lo podéis hacer como con cualquier otro componente. La interfaz pública que ofrece es la siguiente:

Propiedadades

• nCols: Número de columnas
• mediania: Separación en píxels entre columnas
• texto: Texto a renderizar
• css: URL de las css que se aplicarán
• notDrawedText: Si el texto que se tiene que renderizar no cabe en el espacio destinado al componente, el texto que no quepa quedará almacenado en esta variable.

Métodos

• invalidate(): Fuerza el repintado del componente
• getTextAtColumn(i:Number): Devuelve el texto de la columna i-ésima.

Problemas conocidos

• Por la naturaleza del parseador para detectar los tags html, en el texto no pueden aparecer los carácteres < ni >. En su defecto se tienen que usar &gt; y &lt;
• Si se quieren incluir imágenes medinate el tag img, éste tiene que incluir los atributos height y width. De no ser así los cálculos para saber en qué posición se debe cambiar de columna serán erróneos. Esto es debido a que la carga de las imágenes no es immediata y por lo tanto en el momento de calcular la altura del campo no se contempla la presencia de la imagen (aún no cargada)
• En la última versión se han corregido dos bugs. El primero consistía en que sí se abría un tag html renderizado en la primera columna y no se cerraba hasta la tercera, el componente lo cerraba automáticamente en la segunda. El otro bug consistía en que no se habían tenido en cuenta los tags simples como los img, que se cierran y abren con un sola etiqueta. Por como estaba hecho se duplicaba la imagen. Ambos han quedado resueltos.

Por último comentar que si descargáis el código encontraréis un archivo de ejemplo de utilización. Si ejecutais el swf desde un standalone player y redimensionais la ventana veréis como se van redibujando las columnas adaptándose al nuevo tamaño de la ventana.

Si detectais cualquier otro fallo no dudéis en notificarlo en los comentarios del post del blog de elecash.

Descargar código fuente.
Descargar extensión instalable.

Permalink Comments (73)

El problema es el siguiente. Queremos que un tree component cargue sus datos de un xml y que saque de este el estado inicial de sus TreeNodes (si estan abiertas o cerradas).

Para hacerlo podríamos implementar una función que recorriera el dataProvider en busca del atributo isOpen y hacer un setIsOpen(true). Pero si modificamos el código del componente resulta algo más sencillo.

En la linea 58 de la clase mx.controls.treeclasses.TreeRow donde pone:

				if (branch) {
 	   if (nI==undefined) {
  	   nI = owner.getStyle( (open) ? "folderOpenIcon" : "folderClosedIcon");
  	} else {

ponemos:

				if (branch) {
 	   if (nI==undefined) {
  		  nI = owner.getStyle( (open) ? "folderOpenIcon" : "folderClosedIcon");
  	   }
 	
 	   if (node.attributes.isOpen == "true" && firstTime) {
  		  owner.setIsOpen(node,true,false,false);
  		  firstTime = false;
  	   } 
 	} else {

Donde la variable firstTime es una variable de clase (definida con el resto de variables de la clase) definida como:

				var firstTime:Boolean = true;

Ahora podremos utilizar una estructura de xml como la siguiente:

			<node label="Local Folders" isOpen="true">
   <node label="Inbox" data="0"/>
   <node label="Outbox" data="1"/>
</node>

Acordaros que para que los cambios que hagáis en la clase TreeRow afecten al componente que tengas en el fla, teneis que forzar la carga de la clase. Yo simplemente pongo una referencia a ella en el frame 1: mx.controls.treeclasses.TreeRow; Para aseguraros que se está cargando podéis ponerle algun trace de verificación.

Permalink Comments (41)

Pues eso... He renovado un poquito los aires del blog, que ya estaba un poco caduco y anticuado.

Ahora ya sólo falta volver a coger el ritmo y escribir un poco de tanto en vez :P

Saludos

Permalink Comments (20)

Muy buenas. Ando creando una colección de cellRenderers y un generador/configurador a través de xml para el componente dataGrid.

Uno de los renderers es un cargador de imágenes al estilo del que hay en PhilFlash.

Si miráis el código de este último veréis un comentario del autor diciendo que se produce una extraña inicialización. Pues bién, en mi caso también me he encontrado con el problema, y tras perder unas 3 horitas he llegado a lo que parece un bug en la clase DataGridRow.

En la linea 165, donde pone:

			    cell._y = (__height-cell._height)/2;

Lo he cambiado por:

			if( cell.__height == undefined ) {
     cell._y = (__height - cell._height)/2;
} else {
     cell._y = (__height - cell.__height)/2;
}

Ahora todo ya funciona de lo lindo. El motivo es que el valor de cell.__height es undefined cuando no hay nada cargado en ella y con el código de MM se desplaza _y de forma "incorrecta" ya que cell._y evalua en undefined. Este error lo encontraréis cuando el contenido de la celda lo creeis dinámicamente fuera del constructor.

Permalink Comments (7)