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

Cuando queramos incluir un vídeo en nuestra película flash, hay ciertas dimensiones que mejoran mucho la calidad y sobre todo el rendimiento.

Los tamaños que mejor funcionan son los múltiplos de 16, los múltiplos de 8 algo peor, y los de 4 peor aún. Por lo tanto, si tenemos cierta libertad a la hora de usar uno u otro tamaño, mejor usaremos los de la columna de la izquierda.

Yo he hecho algunas pruebas y funciona mejor un vídeo de 640×480 (columna de la izquierda) que uno de 544×408 (columna del centro), aunque éste último tenga menos pixels. Pero no un poco mejor, bastante.

La tabla la he sacado de esta página de Adobe:

http://www.adobe.com/devnet/flash/apps/flv_bitrate_calculator/video_sizes.html

También hay información interesante en este otro artículo, como el keyframe interval de 8:

http://www.adobe.com/devnet/flash/articles/encoding_video_print.html

Pues si, una revista dedicada exclusivamente al mundo de Flash y de Flex, así que si estás leyendo este blog, seguro que te interesa

http://ffdmag.com/

Es una revista muy muy completa y de un nivel medio/alto, con muy buenos artículos con código para picar y las últimas tendencias en aplicaciones, APIs y software relacionado con Flash, Flex y ActionScript.

Lo mejor es que ahora es descargable en versión pdf, por lo que aquí dejo el enlace directo. Hay que meter tu mail pero nada más, ni siquiera requiere confirmación.

http://ffdmag.com/prt/view/pdf-articles.html

Una lectura más que recomendable.

Y ahora, a preparar la maleta, que mañana me voy al Subflash

Ya hemos visto como instalar Eclipse con el plugin de Flex para editar ActionScript, pero no sabemos cómo vincular un clip de película de la biblioteca al escenario, lo que en AS2 era un attachMovie.

En Flash lo haríamos así:

var cuadrado:Cuadrado = new Cuadrado();
cuadrado.x = 100;
cuadrado.y = 100;
addChild(cuadrado);

donde Cuadrado es el nombre de la clase asociada a ese clip de la biblioteca, pero en Eclipse no tenemos biblioteca. Entonces, ¿como lo hacemos???

Tenemos que exportar la biblioteca como un archivo swc, e importarlo luego en nuestro proyecto de Eclipse. El resto es exactamente igual.

Leer el resto de esta entrada

Al final me han liado para instalar y empezar a usar Eclipse como editor de código ActionScript. Ya lo habían intentado yo solo hace algún tiempo, pero es mas fácil cuando te lo explica alguien desde el principio

Y como es un poco lioso la primera vez, voy a explicar paso a paso desde su instalación hasta un Hola Mundo.

Lo que vamos a hacer es instalar Eclipse, un editor de código gratuito que se usa para programar en diferentes lenguajes. Luego instalaremos el plugin de Flex para que entienda la sintaxis ActionScript y para poder compilar nuestros proyectos desde el Eclipse. El plugin es de pago.

Hay otro plugin que permite editar ActionScript llamado FDT, también de pago, pero no permite editar mxml de Flex, y tiene que tener el SDK de Flex para poder compilar SWFs. Hay un estupendo vídeo explicativo en xinterface de cómo instalarlo y crear un proyecto.

Leer el resto de esta entrada

Y es que a veces soy un poco bocazas.

Siempre decía que no me hacía falta para nada tener un servidor local para trabajar, que yo era programador front, y que eso era para PHPeros… pues después de que mi compañero Isra me animase a hacerlo, anoche lo instalé en local, con el wordpress, los plugins y la misma base de datos que tengo online… fantástico. No se como he podido vivir hasta ahora sin un localhost

Fué realmente sencillo, instalas el WAMP (Windows Apache MySQL PHP) o el MAMP en Mac (y es que en el trabajo tengo un Mac, otra cosa que dije que nunca haría… voy a borrar esa palabra de mi mente…).

Dando siguiente, siguiente, siguiente te deja todo instalado y configurado, PHP, la bbdd MySQL y el servidor Apache.

Luego puedes gestionar la bbdd desde el propio apache, o instalar un cliente de bbdd como el Navicat, que permite crear tablas, sincronizarlas, sentencias SQL… lo hace todo mucho mas fácil.

Y ya puedes ponerte a trastear con PHP sin miedo de romper nada en servidor :))

Esto hace que pueda trabajar sin depender de nadie de back-end, al menos para cosas básicas… hasta el infinito…y más allá!!

Lo típico, tienes un array de números, y quieres saber el valor máximo. Extrañamente no hay ningún método en los Arrays de AS3 para hacerlo ¿? y con un sort a veces se le pira la pinza y no lo hace bien. Además, se supone que es mas costoso de rendimiento.

// Devuelve el valor maximo de un array numerico
function max(array:Array):Number{
	var maxVal:Number = 0;
	for each(var item:Number in array){
		maxVal=(item>maxVal) ? item : maxVal;
	}
	return maxVal;
}

var miArray:Array = [1, 4, 35, -76, 2];
trace(max(miArray));  // Devuelve 35

Los de Adobe Labs no paran de sacar cosas nuevas últimamente, ahora están con la Beta de unas librerías para manejar textos en Flash (por fin, sólo 10 versiones tarde).

Se basan en las nuevas capacidades del player 10, y se pueden usar con Flash CS4 y Flex, y entre otras cosas permiten hacer "inline images" o lo que siempre se ha podido hacer con html, poner emoticones o cualquier imagen como parte de un texto, alineado como una palabra mas. Si alguna vez os ha tocado hacerlo en flash, entenderéis mis saltos de alegría ante esta novedad

Se puede ver una presentación en http://labs.adobe.com/technologies/textlayout/

Ya vimos que se pueden emitir eventos personalizados para recogerlos con un listener, no tenemos que limitarnos a los que trae Flash por defecto.

Ahora vamos a dar un paso más. Queremos emitir un evento que diga que se ha terminado una acción, pero además queremos indicar si ha ido bien (true), o ha ido mal (false).

Este es el evento que queremos emitir:

dispatchEvent(new EventExtra("accionTerminada", true));

Creamos un nuevo evento de tipo EventExtra donde le indicamos el nombre del evento que queremos emitir y los parámetros que queramos, que para eso es nuestro evento

Vamos a ver la clase EventExtra:

package {

	import flash.events.*;

	// Extiendo la clase Event para que funcione como un evento mas al enviarse y recibirse.
	public class EventExtra extends Event{

		public var exito:Boolean;

		public function EventExtra(nombre:String, exito:Boolean=true){
			// Inicializo el constructor de Event
			super(nombre);
			// Guardo el valor de exito en una variable para poder acceder luego a ella.
			this.exito = exito;
		}
	}
}

No tiene nada especial, es un envoltorio de la clase Event pero recibe un parámetro extra que almaceno para luego poder acceder a su valor.

Así es como se recogería nuestro evento, con un listener, como siempre en AS3:

// Escucho si objetoEmisor emite el evento "accionTerminada" y le indico su detector de eventos.
objetoEmisor.addEventListener("accionTerminada", detectorAccionTerminada)

// El detector del evento, recibe un objeto evento de tipo EventExtra
function detectorAccionTerminada(evento:EventExtra):void{
	// Como tengo una referencia al evento, puedo acceder a sus variables publicas (exito).
	trace(evento.exito)
}

Leer el resto de esta entrada

Algo tan sencillo y resulta que no se puede ¿?

plegar_btn.addEventListener(MouseEvent.MOUSE_UP,  plegar, true);

No me deja ponerle mas parámetro tras la referencia a la función. ¿para qué sirve una función si no le puedo pasar parámetros? Y es una pena, porque con éste método ya me había olvidado del Delegate.create…

Buscando por la red, la solución que mas me convence por lo sencilla y elegante es la de Wildwinter, que se ha construido una clase Callback tal y como se hacía con el Delegate de AS2, de tal manera que ahora podemos poner

plegar_btn.addEventListener(MouseEvent.MOUSE_UP, Callback.create(plegar, true));

Y con ello conseguimos poder pasar los parámetros que queramos a la función plegar. En este caso "true", pero podría ser cualquier otro, o varios.

Lo mejor de este método frente a otros es que es un "envoltorio" del verdadero evento, con lo que en la función receptora, seguiremos teniendo como primer parámetro el evento de tipo MouseEvent.

Leer el resto de esta entrada

Hay una nueva versión de esta librería de JavaScript que sirve para incrustar contenido flash en nuestro html.

Como ya hemos visto en Flash 99% bueno, esta forma de hacerlo nos ofrece varias ventajas:

1. Es muy fácil de insertar, mas sencillo que incluir las etiquetas object, es una solución respetuosa con los estándares, y es común para todos los navegadores.
2. Evita el tener que hacer clic sobre el objeto flash para activarlo en las últimas versiones de Internet Explorer.
3. Nos permite incluir un contenido "alternativo" accesible para usuarios que no tengan flash player o naveguen con JavaScript deshabilitado.
4. Google y otros motores de búsqueda son capaces de leer e indexar ese contenido alternativo perfectamente.

Ahora, con el SWFObject, ponemos una capa (div) con el contenido no-flash o alternativo (por supuesto podemos dejarla vacía). Esta capa, será sustituida por el contenido flash, de forma totalmente transparente para el usuario.

Eso si, tenemos que darle un id a la capa para que el SWFObject sepa dónde queremos que ponga nuestro flash.

<div id="miFlash">Texto Alternativo</div>

Ahora, en la cabecera del html, incluimos la librería del SWFObject, y hacemos la llamada para que se incluya el flash.

<script type="text/javascript" src="swfobject.js"></script>

<script type="text/javascript">
	//swfobject.embedSWF(swfUrl,      id,    width, height, version)
	swfobject.embedSWF("test.swf", "miFlash", "300", "120", "8.0.0");
</script>

Leer el resto de esta entrada