Archivo de la categoría ‘Flash’

AIR – Web Browser

Publicado por Iván Gajate el 5 de octubre de 2013 en AIR, AS3, Flash | Los comentarios están cerrados.

He tenido que hacer una aplicación de escritorio con AIR con un navegador embebido dentro. He encontrado muchos ejemplos en Flex, pero no tanto en Flash, así que aquí dejo el archivo por si a alguien le resulta útil.
El ejemplo tiene botones y una barra de dirección, pero básicamente hace esto:

var webView:StageWebView = new StageWebView();
webView.stage = this.stage;
webView.viewPort = new Rectangle(0, 0, stage.stageWidth, stage.stageHeight);
webView.loadURL('http://www.yporqueno.es');

Descargar Navegador Web en AIR

AS3 – Recoger parámetros externos con loaderInfo

Publicado por Iván Gajate el 20 de septiembre de 2013 en AS3, Flash | Los comentarios están cerrados.

Algo muy típico es pasarle parámetros a Flash desde el html que lo contiene para que se inicie la carga según esos parámetros, por ejemplo para pasarle un idioma inicial, o alguna contraseña generada en el servidor.

En nuestro html sería algo así (si utilizamos swfobject que deberíamos 🙂

 

<script type="text/javascript">
	var flashvars = {};
	// Inyecto tantas variables como quiera
	flashvars.foo = "foo";
 
	var params = {menu:"false", scale:"noscale", bgcolor:"FFFFFF", allowScriptAccess:"always"};
	var attributes = {};
	//swfobject.embedSWF(swfUrl,      id,    width, height, version, expressInstallSwfurl, flashvars, params, attributes)
	swfobject.embedSWF("miflash.swf", "flashdiv", "1000", "600", "10.0.0", "playerProductInstall.swf", flashvars, params, attributes);
</script>

Desde nuestra peli de flash, podemos recoger esa variable foo utilizando loaderInfo:

 

package {
 
	import flash.display.MovieClip;
	import flash.text.TextField;
	import flash.events.*;
 
	public class Main extends MovieClip {
 
		public function Main() {
			this.addEventListener(Event.ADDED_TO_STAGE, added); // Me aseguro que esta addedToStage
		}
 
		private function added(e:Event):void{
			this.removeEventListener(Event.ADDED_TO_STAGE, added);
 
			if (loaderInfo != null){
				var parametros:Object = loaderInfo.parameters;
 
				// Para evitar que genere error en caso que no haya variables creamos un contador
				var cont:int = 0;
				for (var param:String in parametros){
					trace(parametros[param]);
					cont++;
				}
			}
 
		}
 
	}
}

Flash Builder Snippets

Publicado por Iván Gajate el 18 de septiembre de 2013 en Desarrollo Web, eclipse, Flash | Los comentarios están cerrados.

Ya soy adicto a estos trocitos de código y me siento inútil si trato de programar sin ellos instalados 🙂

Para utilizarlos hay que instalar un plugin en Flash Builder (o Eclipse) llamado CFEclipse. Para instalarlo lo mas fácil es ir a

Help > Install new Software > Add…

Tal y como se explica aquí.

Una vez instalado, sacamos la ventana del plugin en Flash Builder en

Window > Show View > Other…

y el plugin aparece como CFML > Snip Tree View

Desde ese panel podemos añadir nuestros snippets y asignarles atajos de teclado.

Si quieres utilizar mis snippets solo hay que cerrar Flash Builder, abrir la carpeta de nuestro Workspace (se configuró en su día cuando abrimos el programa por primera vez, está en las preferencias), y dentro veremos la ruta .metadata > .plugins > org.cfeclipse.cfml > snippets (Ojo!! son carpetas ocultas, tendremos que poder ver los archivos ocultos en nuestro sistema).

Dentro descomprimiremos nuestros snippets (en carpetas) junto con un archivo que guarda un indice de todos.

Descargar mis snippets

Yo he modificado el atajo de teclado para que se inserten los snippets, para hacerlo en preferencias de Flash Builder, en General > Keys, modificamos el Insert Snippet de CFML Editor por “Esc” “in Window

Así, si pulsamos “pfn+esc” nos escribirá:

//
public function ():void{
 
}

Con el cursor parpadeando en el nombre 😀

AS3 – A toda velocidad con Alchemy

Publicado por Iván Gajate el 16 de septiembre de 2013 en AS3, Flash | Los comentarios están cerrados.

Hay un proyecto de Adobe llamado Alchemy que sirve para portar librerías de C a ActionScript y poder utilizarlas en nuestros proyectos. El resultado es librerías muy fáciles de usar y que aportan una velocidad brutal a la hora de hacer procesos pesados de procesador.

Un ejemplo impresionante es el de codificar imágenes como jpg:

http://www.websector.de/blog/2009/06/21/speed-up-jpeg-encoding-using-alchemy/

Y aquí el ejemplo para descargar.

Subflash 2013

Publicado por Iván Gajate el 28 de agosto de 2013 en Eventos, Flash, JavaScript | Los comentarios están cerrados.

Otro año que vamos al Subflash!!

y este año… me toca dar una charla a mi 🙂

Ironías de la vida, tantos años yendo como flashero y ahora voy a hablar de Programación en JavaScript, la idea es seguir trabajando como en flash pero con JS 🙂

Corréd! que aún estáis a tiempo! Este año es en Ezcaray, un lugar precioso de La Rioja.

http://www.subflash.com/talleres/2013/

AS3 – Gestos Multitouch

Publicado por Iván Gajate el 22 de agosto de 2013 en AS3, Flash | Los comentarios están cerrados.

Vaya librería maja que he encontrado para gestionar los eventos de multitouch de un dispositivo móvil. Con ella es super fácil hacer el zoom y arrastrar y rotar un clip de película:

https://github.com/fljot/Gestouch

Es tan fácil como esto:

var freeTransform:TransformGesture = new TransformGesture(myImage);
freeTransform.addEventListener(GestureEvent.GESTURE_BEGAN, onFreeTransform);
freeTransform.addEventListener(GestureEvent.GESTURE_CHANGED, onFreeTransform);
 
function onFreeTransform(event:GestureEvent):void {
	// move, rotate, scale — all at once for better performance!
	trace(freeTransform.offsetX, freeTransform.offsetY, freeTransform.rotation, freeTransform.scale);
}

AS3 – Bitmap to ByteArray y ByteArray to Bitmap

Publicado por Iván Gajate el 20 de agosto de 2013 en AS3, Flash | Los comentarios están cerrados.

He encontrado esta utillería muy maja para convertir un Bitmap en un ByteArray y viceversa.

Yo la he modificado un pelín para que acepte el smoothing como parámetro en la conversión a Bitmap, algo que me parece muy necesario:

 

package au.com.dashdigital.utils{
 
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.utils.ByteArray;
 
	public class BitmapSerialize {
 
		/**
		* Bitmap to ByteArray
		*/
		public static function encode(bitmap:Bitmap):ByteArray {
			bitmap.smoothing = true;
			var bytes:ByteArray = new ByteArray  ;
			bytes.writeUnsignedInt(bitmap.bitmapData.width);
			bytes.writeBytes(bitmap.bitmapData.getPixels(bitmap.bitmapData.rect));
			bytes.compress();
			return bytes;
		}
 
		/**
		* ByteArray to Bitmap
		*/
		public static function decode(bytes:ByteArray,pixelSnapping:String="auto",smoothing:Boolean=false):Bitmap {
			var bitmap:Bitmap = null;
			try {
				bytes.uncompress();
				var width:int = bytes.readUnsignedInt();
				var height:int = bytes.length - 4 / 4 / width;
				var bmd:BitmapData = new BitmapData(width,height,true,0);
				bmd.setPixels(bmd.rect,bytes);
				bitmap = new Bitmap(bmd,pixelSnapping,smoothing);
			} catch (e:Error) {
				trace('BitmapSerialize error uncompressing bytes');
			}
			return bitmap;
		}
 
 
	}
}

AS3 – Zoom Blur con Pixel Bender

Publicado por Iván Gajate el 3 de diciembre de 2012 en AS3, Flash | Los comentarios están cerrados.

Pixel Bender es un lenguaje de programación creado por Adobe que permite aplicar filtros muy potentes a las imágenes aprovechando la potencia de nuestro hardware.

En este caso vamos a hacer el típico desenfoque de zoom. Utilizaremos el filtro de  Ryan Phelan.

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

 

Descargar ejemplo Zoom Blur

Este es el código:

package {
 
	import flash.net.URLLoader;
	import flash.display.Shader;
	import flash.filters.ShaderFilter;
	import flash.net.URLLoaderDataFormat;
	import flash.net.URLRequest;
	import flash.display.MovieClip;
	import flash.events.Event;
	import fl.events.SliderEvent;
	import flash.display.Sprite;
	import flash.external.ExternalInterface;
 
	public class Main extends Sprite{
 
		private var _clip:MovieClip;
		private var _loader:URLLoader;
		private var _shader:Shader;
		private var _zoomFilter:ShaderFilter;
 
		public function Main() {
			_clip = clip_mc;
			deslizador.visible = false;
			loadFilter();
 
		}
 
 
		// Cargo el filtro
		private function loadFilter():void {
			_loader = new URLLoader();
			_loader.dataFormat = URLLoaderDataFormat.BINARY;
			_loader.addEventListener(Event.COMPLETE, filterLoadComplete);
			var path:String = this.loaderInfo.loaderURL;
			var index:Number = path.lastIndexOf("/");
			if(index != -1){
				path = path.slice(0, index) + "/";
			}else{
				path = "";
			}
			//trace(path);
			_loader.load(new URLRequest(path + "zoomBlur.pbj"));
		}
 
		// Cuando esta cargado creo el Shader e inicializo algunos valores
		private function filterLoadComplete(event:Event):void {
			_shader = new Shader(_loader.data);
 
			// valores entre 0 y 2048
			_shader.data.center.value = [_clip.width*0.5, _clip.height*0.5];
			_zoomFilter = new ShaderFilter(_shader);
 
			// Comienzo a escuchar el evento del deslizador
			deslizador.visible = true;
			deslizador.addEventListener(SliderEvent.CHANGE, sliderChanged);
		}
 
		// Cuando se mueve el deslizador actulizo el filtro y el label del deslizador
		private function sliderChanged(e:SliderEvent):void{
			updateBlur(e.value);
			label.text = String(e.value);
		}
 
		// Cambia el valor del desenfoque y refresca el clip
		private function updateBlur(amount:Number):void{
			// Valores entre 0 y 0.5
			_shader.data.amount.value = [amount];
			_zoomFilter.shader = _shader;
			_clip.filters = [_zoomFilter];
		}
 
 
 
 
	}
 
}

Modificar varias imágenes de la biblioteca a la vez

Publicado por Iván Gajate el 3 de diciembre de 2012 en Flash | Los comentarios están cerrados.

En Flash CS5 hay un panel nuevo que no había visto hasta ahora. Para cambiar las propiedades de varias imágenes a la vez, por ejemplo para que estén suavizadas, ahora seleccionamos las imágenes que queramos > botón derecho > propiedades…

AS3 – tabIndex en campos de texto TLFTextField

Publicado por Iván Gajate el 26 de noviembre de 2012 en AS3, Flash | Los comentarios están cerrados.

Ya vimos como asignar el orden de tabulación en varios campos de texto, sin embargo si los campos de texto son de tipo TLFTextField (para poder escribir en idiomas no latinos entre otras cosas), la forma normal de hacerlo no funciona, Adobe explica aquí como se hace.

InteractiveObject(miCampo.getChildAt(1)).tabIndex = 3;

He escrito esta clase para simplificar el proceso de asignar el orden de tabulación de varios campos de texto, sean TLFTextField o TextField normales:

import es.yporqueno.utils.TextFieldUtils;
 
es.yporqueno.utils.TextFieldUtils.setTabOrder([campo1, campo2, campo4, campo3], stage);

 

function setTabOrder(fields:Array, st:Stage):void {
	if (fields.length == 0) {return;}
	var i:uint = 1;
	for each (var f:Object in fields) {
		if (es.yporqueno.utils.ObjectUtils.getClass(f) == TLFTextField) {
			InteractiveObject((f as TLFTextField).getChildAt(1)).tabIndex = i;
		} else if (es.yporqueno.utils.ObjectUtils.getClass(f) == TextField) {
			InteractiveObject(f).tabIndex = i;
		}
		i++;
	}
 
	var firstField:Object = fields[0];
	if (es.yporqueno.utils.ObjectUtils.getClass(firstField) == TLFTextField) {
		st.focus = InteractiveObject((firstField as TLFTextField).getChildAt(1));
	} else if (es.yporqueno.utils.ObjectUtils.getClass(firstField) == TextField) {
		st.focus = InteractiveObject(firstField);
	}
}

 

Descargar TextFieldUtils.as (Hace uso de otras clases del paquete)

Descargar todo el paquete es.yporqueno