Blog de Daniel Zegarra Rotating Header Image

Tutoriales

Instalar Blueprint desde Adobe Labs

Blueprint example

Blueprint es un plugin para Flex Builder 3 y Flash Builder 4 que te muestra ejemplos de la web relacionados al fragmento de codigo con el que trabajas.

Blueprint example

Blueprint example

Usualmente cuando tienes dudas de como conseguir el resultado esperado (o te da flojera hacerlo tu mismo)  buscas en la web por ejemplos. Esto simplemente te ahorra el trabajo. Tan solo marca el nombre de la clase y presiona Alt+B (Ctrl+B en Mac) para buscar ejemplos relacionados. Puedes mejorar el resultado agregando palabras clave al campo de busqueda. La verdad, es mas comodo que usar el browser.

Para instalarlo dirigete a labs.adobe.com/wiki/index.php/Blueprint:Installation_Instructions y sigue los pasos. Las instrucciones usan screenshots de Flex Builder 3 pero la manera de hacerlo en Flash Builder 4 no es muy distinta (ambos son eclipse).

Visitar la pagina de Blueprint en Adobe Labs

Flex: Clase datagridColumnSelector

Esta es una clase que hice para Flex para mostrar y ocultar las columnas de cualquier instancia de DataGrid sin ensuciarse con mucho codigo.

Menu contextual del DataGrid

Menu contextual del DataGrid

Se puede implementar en solo una linea de codigo:

new datagridColumnSelector(datagridInstance, [campoignorado1]);

El primer argumento es obligatorio y debe ser una instancia de DataGrid. El segundo argumento es opcional y debe recibir un Array con los nombres de las columnas a ignorar.

Cambiando algunas propiedades por defecto:

datagridColumnSelector.label_hide = "Ocultar";
datagridColumnSelector.label_show = "Mostrar";
var selector:datagridColumnSelector = new datagridColumnSelector(data_dg);
selector.hidden = ["col3"];

En el siguiente ejemplo la columna 4 y 5 estan ocultas por defecto. Tambien se decide ignorar la columna 3 para que el usuario no pueda ocultar todas las columnas.
Nota que el valor del atributo headerText en cada DataGridColumn es usado en el menu contextual para que el usuario pueda identificar la columna.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application layout="vertical" creationComplete="init()"
	xmlns:mx="http://www.adobe.com/2006/mxml"
	backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #E7E7E7]"
	paddingBottom="8" paddingLeft="8" paddingRight="8" paddingTop="8" horizontalAlign="left" viewSourceURL="srcview/index.html">

	<mx:Script>
		<![CDATA[
			import net.danielzegarra.utils.datagridColumnSelector;

			protected function init():void{
				new datagridColumnSelector(data_dg, ["col3"]);
			}
		]]>
	</mx:Script>

	<mx:Label text="Haga un clic secundario sobre el DataGrid para mostrar u ocultar columnas."/>
	<mx:DataGrid id="data_dg" width="100%" height="100%">
		<mx:columns>
			<mx:DataGridColumn headerText="Columna 1" dataField="col1"/>
			<mx:DataGridColumn headerText="Columna 2" dataField="col2"/>
			<mx:DataGridColumn headerText="Columna 3" dataField="col3"/>
			<mx:DataGridColumn headerText="Columna 4" dataField="col4" visible="false"/>
			<mx:DataGridColumn headerText="Columna 5" dataField="col5" visible="false"/>
		</mx:columns>
	</mx:DataGrid>
</mx:Application>

Y el resultado:

Ver la fuente | Descargar datagridColumnSelector Class

Nota: Funciona tambien con Air aunque es preferible usar las clases nativas de Adobe Air.

Tips sobre Class mapping con Zend AMF

En resumen Class mapping consiste en relacionar dos clases de lenguajes distintos de tal forma que en cada lenguaje se traten del mismo elemento. Esta relacion (comunmente llamada mapeo en español) permite intercambiar instancias de estas clases entre lenguajes de manera transparente.

Zend AMF mapea por defecto las clases mas comunes como son String, Number, Array, Object, ArrayCollection, etc y tambien permite mapear clases creadas por el usuario. Para lograr el mapeo bidireccional te recomiendo cumplir dos puntos.

  • Define la variable $_explicitType con el alias en cada clase deseas mapear o usa el metodo getASClassName() en lugar de registrar cada mapeo con $serveramf->setClassMap(). Dara mas flexibilidad a tu aplicacion.
  • Intenta relacionar el alias de la clase con la ruta donde la clase PHP a mapear se encuentra. Esto te ayudara a mapear clases de AS3 a Zend AMF.
    Cuando Zend AMF recibe una solicitud lee los alias de las clases AS3 en el mensaje y busca sus clases PHP homologas en el directorio dado por $serveramf->addDirectory(). Si el alias elegido para las clases es, por dar un ejemplo, VO.Usuario Zend AMF buscara la clase VO_Usuario en la ruta VO/Usuario.php.
    Ten en cuenta esto solo si usas addDirectory() para definir la ubicacion de tus servicios y no deseas usar setClassMap() para registrar cada alias.

Las siguientes dos clases se mapearan correctamente entre PHP y AS3 de forma bidireccional.

Ruta: [ServicesPath]/VO/Usuario.php

<?php
class VO_Usuario{

	/**
	 * Usado por Zend AMF. Devuelve el alias de
	 * esta clase para actionscript.
	 * Devuelve una cadena con el nombre de la
	 * clase actual reemplazando _ por puntos.
	 */
	public function getASClassName(){
		return str_replace("_",".",get_class($this));
	}

	public $id;
	public $username;
	public $firstname;
	public $lastname;
	public $enabled;
}
?>

Nota: En este ejemplo uso getASClassName() para obtener dinamicamente el alias de la clase. Seria muy util que este metodo se encontrara en una clase base y que cada clase a mapear herede de esta. De esta forma no tendras que preocuparte por verificar el alias elegido.

Y por otro lado tenemos su clase homologa en AS3:

Ruta: /net/danielzegarra/VO/UsuarioVO.as

package net.danielzegarra.VO{
	//Recuerde que no es necesario que el alias tenga relacion
	//con el nombre de la clase
	[RemoteClass(alias="VO.Usuario")]
	public class UsuarioVO{
		public var id:uint;
		public var username:String;
		public var firstname:String;
		public var lastname:String;
		public var enabled:Boolean;
	}
}

La version de Zend Framework al escribirse este documento es la 1.10.
Puedes encontrar la documentacion de Zend AMF en http://framework.zend.com/manual/en/zend.amf.server.html

Shoutcast gratis

freestreamhosting.org ofrece su servicio de hosting de manera gratuita para streaming de audio (especificamente el servicio shoutcast de nullsoft).

Si ya has probado shoutcast para tener tu estacion de radio en internet sabras que necesitas una conexion de banda ancha dedicada a la salida. Una conexion casera ADSL de 2Mb suele tener no mas de 32kb destinada para la salida. Si cada oyente consumira 10kb entonces tu radio no podra tener mas de 3 oyentes.

La solucion es tener al servidor en una red con salida a internet de alta veolcidad y al emisor de la radio en una red normal. El emisor entrega el audio al servidor y el servidor lo reparte entre los oyentes.

Puedes crear una cuenta gratuita en freestreamhosting.org y tener tu radio en el aire en cuestion minutos.

Para mas informacion sobre como emitir audio con shoutcast puedes leer el tutorial que hice hace mucho tiempo aqui.

Screencasts de Mathematica

Este es un post rapido. He aqui la galeria de screencasts sobre esta fantastica herramienta para docentes y estudiantes de matematica. Lamentablemente no es un software libre, cuesta, pero aun al alcance de las universidades.

Estuve atendiendo a un screencast de introduccion al software y es realmente genial, perfecto para crear documentos o ejemplos interactivos en clase. Estos documentos (llamadas notas) se pueden guardar, compartir y visualizar (con el player que si es gratuito) por cualquiera.

El screencast introductorio no toma mas de media hora y te aseguro que cualquier docente de matematica (y puede que alumnos tambien aunque con menor enfasis) querra poner sus manos encima de esto.

Dejo la direccion del screencast introductorio: Enlace.