electroduendes.com

bitácora de un desarrollador interactivo

electroduendes.com header image 2

Clase PrecargaSerie actionscript 2.0

February 22nd, 2007 · 5 Comments

Por aquí dejo una clase que maneja precargas en serie en Actionscript 2.0, está implementada con LoadMovie para permitir cargar sonidos y demás. Es útil en galerías de imágenes donde las cargas en paralelo no son tan útiles porque hace falta ir mostrando el contenido según va cargando, en el orden de carga. Usa modelo de despachado de eventos, con lo que es muy fácil integrarla con otras clases.

import com.gskinner.events.GDispatcher;
import mx.utils.Delegate;
/**
 * @author ?lex Sánchez
 * http://www.electroduendes.com/
 * @version 1.1
 * @usage  Clase para cargar Jpgs o swfs en un contenedor en serie (una detrás
 * de otra). Suele ser útil para galerías de imágenes.
 * 
 * listeners:
 * 	- onLoadProgress; devuelve un objeto del tipo:
 * 	{type:"onLoadProgress", mc:MovieClip, progress:Number, total:Number, percent:Number};
 * 	
 * 	- onLoadActualStart; devuelve un objeto del tipo:
 * 	{type:"onLoadActualStart", mc:MovieClip}
 * 	
 * 	- onLoadActualComplete; devuelve un objeto del tipo:
 *  {type:"onLoadActualComplete", mc:MovieClip}
 * 	
 * 	- onLoadAllComplete; devuelve un objeto del tipo:
 * 	{type:"onLoadAllComplete"}
 * 	
 * <code>
 * 		import com.electroduendes.precarga.PrecargaSerie;
 * 		import mx.utils.Delegate;
 * 		
 * 		var precarga:PrecargaSerie = new PrecargaSerie();
 * 		var urls:Array = new Array("1.jpg", "2.jpg", "3.jpg", "4.jpg");
 * 		var clips:Array = new Array(_root.uno, 
 * 			_root.dos, _root.tres, _root.cuatro);
 * 		precarga.addEventListener("onLoadProgress", 
 * 			Delegate.create(this, progreso));
 * 		precarga.addEventListener("onLoadActualComplete", 
 * 			Delegate.create(this, fincarga));
 * 		precarga.addEventListener("onLoadAllComplete", 
 * 			Delegate.create(this, fintodo));
 * 		precarga.addEventListener("onLoadActualStart", 
 * 			Delegate.create(this, inicioCarga));
 * 		precarga.loadClips(urls, clips);
 * 		
 * 		function progreso(obj) {
 * 			trace("progreso despachado para mc "+obj.mc+ " al : "+obj.percent+"%");
 * 		}
 * 		function inicioCarga(obj){
 * 			trace("inicio de carga para el mc"+obj.mc);
 * 		}
 * 		function fincarga(obj) {
 * 			trace("fincarga despachada para movieclip: "+obj.mc);
 * 		}
 * 		
 * 		function fintodo() {
 * 			trace("fintodo despachado");
 * 		}	
 * </code>
 */
class com.electroduendes.precarga.PrecargaSerie {
 
	private var numCargados:Number = 0;
	// número de objetos que ya están cargados
	private var actualProgress:Number = 0;
	// almacena el progreso de carga
	private var actualTotal:Number = 0;
	private var actualPercent:Number = 0;
	private var actualTarget:MovieClip = null;
	private var urlArray : Array;
	private var targetArray : Array;
	private var interval:Number = 0;
	var dispatchEvent:Function;
	var addEventListener:Function;
	var removeEventListener:Function;
	function PrecargaSerie(){
		GDispatcher.initialize(this);
	}
	/*
	 * inicia el proceso de carga
	 * @param urlArray el arrray de películas a cargar
	 * @param targetArray el array de contenedores (movieclips)
	 */
	function loadClips(urlArray:Array, targetArray:Array, type:String) {
 
			this.urlArray = urlArray;
			this.targetArray = targetArray;
			load();
	}
	/**
	* efectua el loadMovie. 
	* se va a ejecutar 'n veces' tantas como numCargados.
	*/
	private function load():Void {
		targetArray[numCargados].loadMovie(urlArray[numCargados]);
		// con el setInterval, nos aseguramos de que actualProgress sea > 0
		// guardamos la referencia actual en el atributo actualTarget
		actualTarget = targetArray[numCargados];
		interval = setInterval(Delegate.create(this, loadStart), 50);
	}
	/**
	* permite saber si la carga está iniciada
	* se usa porque la carga no devuelve 0 hasta que no se comienza a cargar
	*/
	private function loadStart():Void {
		actualProgress = targetArray[numCargados].getBytesLoaded();
		// si ya ha empezado a cargar...
		if (actualProgress>=0) {
			// limpiamos esta funcion
			clearInterval(interval);
			onLoadActualStart();
			// con esto conseguimos que actualProgress siempre esté actualizado
			interval = setInterval(Delegate.create(this,onLoadProgress), 50);
		}
	}
	/**
	* permite escuchar el porcentaje de la carga 
	* actualiza las propiedades tales como actualProgress, actualPercent.
	*/
	private function onLoadProgress():Void {
		actualProgress = actualTarget.getBytesLoaded();
		actualTotal = actualTarget.getBytesTotal();
		actualPercent = Math.round((actualProgress*100)/actualTotal);
 
		var eventObj:Object = { type:"onLoadProgress", 
					mc:MovieClip, 
					progress:Number, 
					total:Number,
					percent:Number
					};
		eventObj.mc = actualTarget;
		eventObj.progress = actualProgress;
		eventObj.total = actualTotal;
		eventObj.percent = actualPercent;
 
	  	//despacho evento para los preloaders
	  	dispatchEvent(eventObj);
		if (actualPercent>=100) {
			clearInterval(interval);
			actualProgress = 0;
			numCargados++;
			onLoadActualComplete(actualTarget);
			if (numCargados<targetarray .length) {
				load();
			} else {
				//acabamos!
				onLoadAllComplete();
			}
		}
	}
	/**
	* función que se ejecutará cuando empiece la precarga de
	* algún objeto
	* @param ref 
	* una referencia del objeto que se ha cargado
	*/
	public function onLoadActualStart():Void {
		var eventObj:Object = {type:"onLoadActualStart", mc:MovieClip};
		eventObj.mc = actualTarget;
		dispatchEvent(eventObj);
	}
	/**
	*
	* @usage función que se ejecutará cuando termine la precarga de
	* algún objeto
	* @param ref 
	* una referencia del objeto que se ha cargado
	*/
	private function onLoadActualComplete(ref:Object):Void {
		var eventObj:Object = {type:"onLoadActualComplete", mc:Object};
	  	//despacho evento
	  	eventObj.mc = actualTarget;
	  	dispatchEvent(eventObj);		
	}
	/**
	*
	* @usage función que se ejecutará cuando termine la precarga de
	* de el último objeto a cargar
	*/
	private function onLoadAllComplete():Void {	
		var eventObj:Object = {type:"onLoadAllComplete"};
	  	//despacho evento
	  	dispatchEvent(eventObj);
	}
	/**
	* @usage getter target array 
	* los contenidos
	* @return un array de clips
	*/
	public function getTargetArray():Array {
		return targetArray.slice();
	}
}

Tags: Actionscript 2.0 · Flash · Librerías, recursos

5 responses so far ↓

  • 1 Alan // Mar 8, 2007 at 2:55 am

    Hola Alex: estoy tratando de implementar tu clase con la creación dinámica de Mc’s mediante attachMovie pero no me funciona. Sin embargo, si creo los elementos de manera manual y luego compilo, si funciona. En la libreria tengo un Mc con vinculación “thumb”, y en el stage un Mc vacio con instancia “contenedor” (dentro de él se generan los demás Mc’s llamados thumb0, thumb1, etc)

    El código:

    #include “mc_tween2.as”
    import com.electroduendes.precarga.PrecargaSerie;
    import mx.utils.Delegate;

    var precarga:PrecargaSerie = new PrecargaSerie();
    var urls:Array = new Array();
    var clips:Array = new Array();
    var cantidad:Number = 7;

    function loadThumbs():Void {
    for (var i:Number = 0; i < cantidad; i++) {
    var ubica:MovieClip = contenedor.attachMovie(”thumb”, “thumb” +
    i, i);
    var posx:Number = 0 + i * 55;
    var posy:Number = 0;
    ubica.id = i;
    ubica.tween(["_x", "_y"], [posx, posy], .3, “easeOutQuad”, i*.3);
    ubica.onRelease = function() {
    trace(this.id)
    trace(this._name)
    }
    //gestión de los thumbs y mc’s
    urls.push(i + “.jpg”);
    clips.push(”contenedor.thumb” + i);
    }
    trace(urls);
    trace(clips);
    trace(”——————————”);
    precarga.addEventListener(”onLoadProgress”, Delegate.create(this,
    progreso));
    precarga.addEventListener(”onLoadActualComplete”,
    Delegate.create(this, fincarga));
    precarga.addEventListener(”onLoadAllComplete”, Delegate.create(this,
    fintodo));
    precarga.addEventListener(”onLoadActualStart”, Delegate.create(this,
    inicioCarga));
    precarga.loadClips(urls, clips);

    function progreso(obj) {
    trace(”progreso despachado para mc “+obj.mc+ ” al :
    “+obj.percent+”%”);
    }

    function inicioCarga(obj){
    trace(”inicio de carga para el mc “+obj.mc);
    }

    function fincarga(obj) {
    trace(”fincarga despachada para movieclip: “+obj.mc);
    }

    function fintodo() {
    trace(”fintodo despachado”);
    }
    }
    //———————————————–
    loadThumbs();

  • 2 Alex Sánchez // Mar 8, 2007 at 3:18 am

    en la línea donde tienes:

    clips.push(�contenedor.thumb� + i);

    cámbiala por

    clips.push(ubica);

    date cuenta que estás pasando un array de strings y la clase requiere que el array contenga mcs. Es un defecto que tiene la clase, pero es fácil comprobar el tipado del tipo de dato del array y comprobar que si no es mc, soltar un error, y si es string, hacer un cast a mc. Si te animas a mejorarla o a postear un ejemplo para la misma, por aquí estaré!
    Saludos!

  • 3 Alan // Mar 8, 2007 at 3:30 am

    Estoy aprendiendo a manejar y hacer clases, aun no tengo todo muy en claro. Ya me funciona, pero si dentro de thumb0, thumb1, etc tengo un mc vacio con instancia “foto” para bajar en él la imágen, ya no me funciona.
    Intenté con clips.push(ubica+”.foto”) (ya sabia que no funcionaria) y con var ruta = ubica+”.foto”; –> clips.push(ruta);

  • 4 Alan // Mar 8, 2007 at 3:37 am

    No dije nada, al final es var ubica2:MovieClip = ubica.foto;
    clips.push(ubica2);

  • 5 Alex Sánchez // Mar 9, 2007 at 1:41 am

    me alegro que al final dieras con ello.
    Si al final publicas tu trabajo, me gustará verlo.
    Saludos!

Leave a Comment