¿Y por qué no? - Programación Flash

De los creadores de TweenLite, acaba de salir LoaderMax, un sistema de carga de archivos en cola.

Esta librería es estupenda para cargar todas las imágenes de una galería de imágenes, los sonidos de un player, o todos los xml que queramos a la vez, controlando el progreso de carga y cuándo se termina.

Existen otras alternativas como Bulkloader, pero aumentan el peso considerablemente y no me termina de convencer cómo están programadas.

Aún no he tenido tiempo de probar con detalle el LoaderMax, pero promete una integración sencilla en muy poco peso (10 Kb!)

Aquí un ejemplo básico de cómo se usa:

import com.greensock.loading.*;
import com.greensock.events.LoaderEvent;
import com.greensock.loading.display.*;

// Creo una cola de carga
var queue:LoaderMax = new LoaderMax({name:"mainQueue", maxConnections:1});

// Añado 20 imagenes a la cola
for(var i:uint=1; i<=20; i++){
	queue.append(new ImageLoader("imgs/IMG" + i + ".jpg", {name:"photo"+i, onComplete:imagenCargada}) );
}

// Controlo cuando se termina de cargar cada imagen
function imagenCargada(event:LoaderEvent):void {
    	var image:ContentDisplay = event.target.content;
	image.x = Math.random()*800;
	image.y = Math.random()*600;
	image.scaleX = image.scaleY = Math.random()*0.5;
	addChild(image);
}

// Comienzo la carga
queue.load();

Para descargarlo y ver mas ejemplos, ir a la página del LoaderMax

Hay una forma mucho más sencilla de hacerlo que la que publiqué hace un tiempo, basta con copiar y pegar el proyecto desde dentro de Eclipse (Flex).

Tenemos que tener abierto el proyecto, si no no funciona.

Cuando le demos a pegar, nos preguntará el nombre del proyecto. Es el momento de darle un nombre diferente para que no entre en conflicto con el anterior:

Y listo, ya tenemos nuestro proyecto duplicado sin perder ninguna preferencia del proyecto

Una funcioncilla muy útil si queremos recortar la longitud de una frase a un número máximo de caracteres.

Acorta la frase sin romper las palabras, si una palabra se queda a medias, devuelve la cadena hasta el principio de esa palabra, y añade puntos suspensivos (…) al final.

El típico ejemplo es un destacado de una noticia en el que sólo queremos mostrar las primeras palabras.

public static function shortenString(string:String, maxCharacters:uint, append:String="..."):String {
	if (string.length <= maxCharacters) {
		return string;
	}
	maxCharacters -= append.length;
	// Complete word after blank space
	if (string.substr(maxCharacters, 1) == " ") {
		return string.substr(0, maxCharacters) + append;
	}
	// Incomplete word
	string = string.substr(0, maxCharacters);
	var lastCharacter:Number = string.lastIndexOf(" ");
	string = string.substr(0, lastCharacter) + append;
	return string;
}

Se usaría así:

import es.yporqueno.utils.StringUtils;

var miTexto:String = "Vero eros et accumsan et iusto odio dignissim qui blandit praesent";

trace(shortenString(miTexto, 50));
// Vero eros et accumsan et iusto odio dignissim...

Este tipo de funciones las voy a ir recopilando en una clase StringUtils.

• Descargar StringUtils.as

Y la compañera de getElementsByName y getElementById es esta.

Supongamos que tenemos un xml con varios nodos con la misma definición de clase:

<div>
	<p class="parrafo">
		Esto es un párrafo
	</p>
	<form>
		<input type="checkbox" id="chk0">Leer</input> <br />
		<input type="checkbox" id="chk1">Montar en bici</input> <br />
		<input type="checkbox" id="chk2">Dormir</input> <br />
	</form>
	<p class="parrafo">
		Esto es otro párrafo diferente, pero con la misma clase
	</p>
</div>

Y queremos recuperarlos en forma de XMLList:

function getElementsByClass(data:XML, className:String):XMLList{
	return data.descendants().(hasOwnProperty("@class") && attribute("class")==className);
}

// Se usaria asi:
getElementsByClass(miXml, "parrafo");

Y devolvería esto:

<p class="parrafo">Esto es un párrafo</p>
<p class="parrafo">Esto es otro párrafo diferente, pero con la misma clase</p>

Este tipo de funciones las voy a ir recopilando en una clase XmlUtils.

• Descargar XmlUtils.as

La parejita de getElementById

Muy útil por ejemplo para obtener todos los checkBox de un xml:

<div>
	<form id="aficiones">
		<input type="checkbox" id="chk0" name="c0">Leer</input> <br />
		<input type="checkbox" id="chk1" name="c1">Montar en bici</input> <br />
		<input type="checkbox" id="chk2" name="c2">Dormir</input> <br />
	</form>
</div>

En este caso lo que nos interesa es un listado (XMLList) con todos los nodos del mismo tipo.

function getElementsByName(data:XML, name:String):XMLList{
	return data.descendants(name);
}

// Se usaria asi:
getElementsByName(miXml, "input");

Este tipo de funciones las voy a ir recopilando en una clase XmlUtils.

• Descargar XmlUtils.as

Si tenemos un xml con etiquetas anidadas como esta:

<contenedor>
	<caja>
		<item id="expediente1">
			Contenido del expediente 1
		</item>
	</caja>
	<caja>
		<item id="expediente2">
			Contenido del expediente 2
		</item>
	</caja>
</contenedor>

Y queremos acceder directamente al nodo <item id=”expediente1”> podemos hacerlo con esta línea de E4X:

miXml.descendants().(hasOwnProperty("@id") && @id == "expediente1")[0]

Es fácil de entender, nos devolverá un XMList con todos los nodos que tengan el atributo “id”  y que id==”expediente1”. Y de ese nos quedamos con el primero.

Podemos meterla en una función para que sea más cómoda de usar:

function getElementById(data:XML, id:String):XML{
	return data.descendants().(hasOwnProperty("@id") && @id==id)[0];
}

// Se usaria asi:
getElementById(miXml, "expediente1");

La solución me la ha dado Joseba en la lista de AsNativos.

Este tipo de funciones las voy a ir recopilando en una clase XmlUtils.

• Descargar XmlUtils.as

Si queremos insertar tabulaciones en un campo de texto o componente textArea de Flash, por defecto nos pasará el foco al siguiente campo de texto o botón.

Para evitar esto me ha dado la solución Ícaro Obregón en la lista de AsNativos, utilizando el método preventDefault() y luego haciendo un apaño para situar el cursor al final del texto, pues si no parecerá que no ha ocurrido nada.

miCampoTexto.addEventListener(FocusEvent.KEY_FOCUS_CHANGE, onFocusChange);

function onFocusChange(event:FocusEvent):void {
	event.preventDefault();

	miCampoTexto.appendText("\t");
	miCampoTexto.setSelection(miCampoTexto.length, miCampoTexto.length);
}

Esto siempre me lía mucho, así que lo tengo guardadito como oro en paño entre mis snippets. Lo comparto:

// 16711680 es el color rojo en hexadecimal
var colorHex:uint = 16711680;
var colorRGB:String = "0x" + colorHex.toString(16);  // 0xff0000

Y para hacer lo contrario:

// Rojo en RGB
var colorRBG:uint = 0xff0000;
var colorHex:uint = uint(colorRBG);  // 16711680

Atentos al tipado de datos. El color en rgb es de tipo uint, no String. aunque parezca raro.

Esta función devuelve un número con tantos dígitos como queramos, poniendo ceros delante:

function addZeroBefore(number:uint, digits:uint):String {
	var numDig:Number = digits-String(number).length;
	if (numDig<=0) {
		return String(number);
	}
	numDig = Math.pow(10, numDig);
	var stringDig:String = String(numDig).substring(1);
	return stringDig + String(number);
}

Ejemplo:

addZeroBefore(99, 4); //0099

Este tipo de funciones las voy a ir recopilando en una clase NumberUtils.

• Descargar NumberUtils.

¿Cómo no se nos habrá ocurrido antes?!!

Mi amigo Luis se ha hecho un pequeño comando para automatizar esta tarea táaaan tediosa del dia a dia. Ahora en lugar de hacer esto:

Podremos hacer esto:

Genial Luis, me has ahorrado horas de curro

Leer artículo completo en Nomeva.