Archivo de la categoría ‘AS3’

AS3 – Validar Fechas con Expresiones Regulares

Publicado por Iván Gajate el 11 de enero de 2011 en AS3 | 1 comentario »

Una de las mejores formas de validar formularios es con expresiones regulares, son rápidas y muy precisas.

Estas las he tenido que utilizar hoy para validar una fecha de nacimiento y un teléfono de España(noventayalgo…) en un formulario, las dejo por si a alguien le vienen bien:

// Comprueba si empieza por 6 u 8 (nuevos moviles) y tiene 9 digitos
function isMobileNumber(data:String):Boolean {
	var exp:RegExp = /^[68]\d{8}$/;
	return exp.test(data);
}

// Comprueba si empieza por 6, 8 o por 9 y tiene 9 digitos
function isTelephoneNumber(data:String):Boolean {
	var exp:RegExp = /^[689]\d{8}$/;
	return exp.test(data);
}

// Comprueba si es un entero del 1 al 31
function isDay(data:String):Boolean {
	var exp:RegExp = /^[123]0|[012][1-9]|31$/;
	return exp.test(data);
}

// Comprueba si es un entero del 1 al 12
function isMonth(data:String):Boolean {
	var exp:RegExp = /^0[1-9]|1[012]$/;
	return exp.test(data);
}

// Comprueba si es un año desde 1900 al 2999
function isYear(data:String):Boolean {
	var exp:RegExp = /^19[0-9]{2}|2[0-9]{3}$/;
	return exp.test(data);
}

Para usarlas solo hay que poner:

trace(isMobileNumber("6203587852")) // true
trace(isMobileNumber("7203587852")) // false

Aunque son algo complicadas de leer, se pueden buscar en Internet con facilidad, hay sitios como este donde se pueden ver muchos ejemplos y hacer pruebas en tiempo real:

http://gskinner.com/RegExr/

AS3 – Realidad Aumentada y Rotación

Publicado por Iván Gajate el 8 de diciembre de 2010 en AS3, Flash, Lab | 6 comentarios »

Si estamos haciendo un ejercicio de realidad aumentada y queremos obtener la rotación x, rotación y o rotación z, no es tan fácil conseguirlas como podría parecer en un principio.

Buscando mucho encontré un comentario en un blog donde explicaban cómo obtener los valores a partir de una matriz de transformación, pero era poco práctico de usar y difícil de entender, así que he hecho una clase Marker que simplifica enormemente el proceso de conseguir estos valores (el marker es la plantilla que imprimimos y que es detectada por la webcam).

Ahora es tan fácil como hacer esto, y nos devolverá la rotación en el eje Z (perpendicular al plano del marker) como un número entre 0 y 360 grados:

var angle:Number = Marker.getInstance().rotationZ;

Para aplicarlo a algún objeto, como por ejemplo esta brújula.

Leer el resto de esta entrada

AS3 – Detectar Exit FullScreen

Publicado por Iván Gajate el 7 de noviembre de 2010 en AS3, Flash | No hay comentarios »

Si queremos detectar cuándo nuestra película entra o sale del modo de pantalla completa (fullscreen), basta con escuchar el evento FullScreenEvent:

stage.addEventListener(FullScreenEvent.FULL_SCREEN, onFullScreen);

function onFullScreen(e:FullScreenEvent):void{
	// Compruebo si estoy saliendo del modo fullscreen
	if(e.fullScreen == false){
		setTimeout(onResize, 50);
	}
}

function onResize():void{
	// Recoloco el escenario
}

Esto es muy útil pues cuando flash sale del modo pantalla completa suele descolocar algunas cosas, así que es un buen sitio para volver a llamar a un método onResize personalizado. Lo del timer de 50 milisegundos es porque si se llama directamente no funciona, hay que esperar un poco :(

AS3 – Hacer un Tween de un Punto.

Publicado por Iván Gajate el 29 de octubre de 2010 en AS3, Flash, Lab | No hay comentarios »

Normalmente hacemos un tween de un MovieClip, cambiando sus propiedades x, y, alpha… pero se puede hacer un tween sobre cualquier propiedad numérica de cualquier objeto, como por ejemplo del objeto Point.

var p1:Point = new Point(0, 0);

TweenLite.to(p1, 1.5, {x:200, y:300});

Con esto, podríamos dibujar un paralelogramo que apareciese con un efecto mas interesante que un simple escalado.

Hacer clic sobre la imagen para refrescar:

(Archivo Flash, para verlo necesitas Adobe Flash Player.)

Calculamos la posición de cada uno de sus vértices, con un efecto de rebote. Mientras se ejecuta redibujamos la figura con la API de dibujo de Flash.

Si ese mismo clip lo usamos para enmascarar una foto, el efecto es mejor:

(Archivo Flash, para verlo necesitas Adobe Flash Player.)

Lo mejor es que si esa foto tiene algún filtro, como una sombra o un iluminado interior, el efecto se va adaptando a la nueva forma de la máscara.

Descargar Ejemplo

Z-sorting en Flash Player 10

Publicado por Iván Gajate el 16 de septiembre de 2010 en AS3, Flash | No hay comentarios »

Para ordenar facilmente nuestros clips en el eje Z si usamos Flash CS4 o superior, podemos utilizar esta clase muy interesante de Ralph Hauwert

Usarla es super simple, solo hay que llamar a

SimpleZSorter.sortClips()

cada vez que queramos ordenarlos.

Mas explicaciones en el blog de Lee Brimelow

Descargar la clase SimpleZSorter

Via Jose Luís de Coconnut a través de ASNativos

Sugerir resultados de búsqueda con Levenshtein

Publicado por Iván Gajate el 6 de septiembre de 2010 en AS3, Sitios Destacados | No hay comentarios »

Este tio (HIDIHO) nunca deja de sorprenderme…

Aquí explica cómo mostrar sugerencias de búsqueda para un listado de nombres utilizando la distancia de Levenshtein.

http://en.nicoptere.net/?p=854

AS3 – Precargar la película principal (II)

Publicado por Iván Gajate el 10 de agosto de 2010 en AS3, Flash, Tutoriales | 8 comentarios »

Ya vimos cómo hacer un preload en AS3 de nuestra película principal. Ahora he cambiado un poco los archivos para que resulte más fácil de utilizar y me quito de encima las cosas que no me gustaban de la anterior precarga, aunque la idea sigue siendo la misma: una peli externa que carga la principal.

Ahora va por eventos, y se gestiona todo desde la peli precarga.fla. Ahí cambias la gráfica de la precarga y lo que quieras que haga durante el progreso y cuando termine.

Ya no hay que meter parámetros propios en el html (a menos que se quiera claro). También recoge los parámetros de la url directamente y se los inyecta a la peli principal como flashvars.

Hay un parámetro que si que puede recibir para evitar la caché del navegador ‘avoidCache’ (por defecto a false).

Descargar ejemplo del Precargador

LoaderMax – Cola de carga

Publicado por Iván Gajate el 17 de junio de 2010 en AS3, Flash | 2 comentarios »

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

Duplicar un proyecto Flex

Publicado por Iván Gajate el 5 de junio de 2010 en AS3, eclipse, Flash, Tutoriales | 2 comentarios »

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.

copiar

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:

cambiar-nombreY listo, ya tenemos nuestro proyecto duplicado sin perder ninguna preferencia del proyecto :D

AS3 – Acortar frases

Publicado por Iván Gajate el 17 de mayo de 2010 en AS3, Flash, Tutoriales | 3 comentarios »

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.