electroduendes.com

bitácora de un desarrollador interactivo

electroduendes.com header image 2
← Summercase 2007, nuevas confirmaciones TuneGlue, explora perfiles musicales y alégrate la vista. →

Clase PrecargaSerie actionscript 2.0

February 22nd, 2007 · 5 Comments

Soy la leche. Hago una clase que puede ser útil para la humanidad, y la tengo dos años y medio cogiendo polvo, y sin apenas usar en plan gollum ( tesoooro) en vez de soltarla, hasta que casi queda obsoleta. Así que, para que la mejoréis y para que la disfrutéis, por aquí suelto esta clase antes de que no la use ni yo.

Es 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.

PLAIN TEXT
Actionscript:
  1.  
  2. import com.gskinner.events.GDispatcher;
  3. import mx.utils.Delegate;
  4. /**
  5. * @author Alejandro Sánchez Marcos
  6. * http://www.electroduendes.com/
  7. * @version 1.1
  8. * @usage  Clase para cargar Jpgs o swfs en un contenedor en serie (una detrás
  9. * de otra). Suele ser útil para galerías de imágenes.
  10. *
  11. * listeners:
  12. *      - onLoadProgress; devuelve un objeto del tipo:
  13. *      {type:"onLoadProgress", mc:MovieClip, progress:Number, total:Number, percent:Number};
  14. *      
  15. *      - onLoadActualStart; devuelve un objeto del tipo:
  16. *      {type:"onLoadActualStart", mc:MovieClip}
  17. *      
  18. *      - onLoadActualComplete; devuelve un objeto del tipo:
  19. *  {type:"onLoadActualComplete", mc:MovieClip}
  20. *      
  21. *      - onLoadAllComplete; devuelve un objeto del tipo:
  22. *      {type:"onLoadAllComplete"}
  23. *      
  24. * <code>
  25. *           import com.electroduendes.precarga.PrecargaSerie;
  26. *           import mx.utils.Delegate;
  27. *           
  28. *           var precarga:PrecargaSerie = new PrecargaSerie();
  29. *           var urls:Array = new Array("1.jpg", "2.jpg", "3.jpg", "4.jpg");
  30. *           var clips:Array = new Array(_root.uno,
  31. *                _root.dos, _root.tres, _root.cuatro);
  32. *           precarga.addEventListener("onLoadProgress",
  33. *                Delegate.create(this, progreso));
  34. *           precarga.addEventListener("onLoadActualComplete",
  35. *                Delegate.create(this, fincarga));
  36. *           precarga.addEventListener("onLoadAllComplete",
  37. *                Delegate.create(this, fintodo));
  38. *           precarga.addEventListener("onLoadActualStart",
  39. *                Delegate.create(this, inicioCarga));
  40. *           precarga.loadClips(urls, clips);
  41. *           
  42. *           function progreso(obj) {
  43. *                trace("progreso despachado para mc "+obj.mc+ " al : "+obj.percent+"%");
  44. *           }
  45. *           function inicioCarga(obj){
  46. *                trace("inicio de carga para el mc"+obj.mc);
  47. *           }
  48. *           function fincarga(obj) {
  49. *                trace("fincarga despachada para movieclip: "+obj.mc);
  50. *           }
  51. *           
  52. *           function fintodo() {
  53. *                trace("fintodo despachado");
  54. *           }   
  55. * </code>
  56. */
  57. class com.electroduendes.precarga.PrecargaSerie {
  58.  
  59.         private var numCargados:Number = 0;
  60.         // número de objetos que ya están cargados
  61.         private var actualProgress:Number = 0;
  62.         // almacena el progreso de carga
  63.         private var actualTotal:Number = 0;
  64.         private var actualPercent:Number = 0;
  65.         private var actualTarget:MovieClip = null;
  66.         private var urlArray : Array;
  67.         private var targetArray : Array;
  68.         private var interval:Number = 0;
  69.         var dispatchEvent:Function;
  70.         var addEventListener:Function;
  71.         var removeEventListener:Function;
  72.         function PrecargaSerie(){
  73.                 GDispatcher.initialize(this);
  74.         }
  75.         /*
  76.          * inicia el proceso de carga
  77.          * @param urlArray el arrray de películas a cargar
  78.          * @param targetArray el array de contenedores (movieclips)
  79.          */
  80.         function loadClips(urlArray:Array, targetArray:Array, type:String) {
  81.                        
  82.                         this.urlArray = urlArray;
  83.                         this.targetArray = targetArray;
  84.                         load();
  85.         }
  86.         /**
  87.         * efectua el loadMovie.
  88.         * se va a ejecutar 'n veces' tantas como numCargados.
  89.         */
  90.         private function load():Void {
  91.                 targetArray[numCargados].loadMovie(urlArray[numCargados]);
  92.                 // con el setInterval, nos aseguramos de que actualProgress sea> 0
  93.                 // guardamos la referencia actual en el atributo actualTarget
  94.                 actualTarget = targetArray[numCargados];
  95.                 interval = setInterval(Delegate.create(this, loadStart), 50);
  96.         }
  97.         /**
  98.         * permite saber si la carga está iniciada
  99.         * se usa porque la carga no devuelve 0 hasta que no se comienza a cargar
  100.         */
  101.         private function loadStart():Void {
  102.                 actualProgress = targetArray[numCargados].getBytesLoaded();
  103.                 // si ya ha empezado a cargar...
  104.                 if (actualProgress>=0) {
  105.                         // limpiamos esta funcion
  106.                         clearInterval(interval);
  107.                         onLoadActualStart();
  108.                         // con esto conseguimos que actualProgress siempre esté actualizado
  109.                         interval = setInterval(Delegate.create(this,onLoadProgress), 50);
  110.                 }
  111.         }
  112.         /**
  113.         * permite escuchar el porcentaje de la carga
  114.         * actualiza las propiedades tales como actualProgress, actualPercent.
  115.         */
  116.         private function onLoadProgress():Void {
  117.                 actualProgress = actualTarget.getBytesLoaded();
  118.                 actualTotal = actualTarget.getBytesTotal();
  119.                 actualPercent = Math.round((actualProgress*100)/actualTotal);
  120.                
  121.                 var eventObj:Object = { type:"onLoadProgress",
  122.                                         mc:MovieClip,
  123.                                         progress:Number,
  124.                                         total:Number,
  125.                                         percent:Number
  126.                                         };
  127.                 eventObj.mc = actualTarget;
  128.                 eventObj.progress = actualProgress;
  129.                 eventObj.total = actualTotal;
  130.                 eventObj.percent = actualPercent;
  131.                
  132.                 //despacho evento para los preloaders
  133.                 dispatchEvent(eventObj);
  134.                 if (actualPercent>=100) {
  135.                         clearInterval(interval);
  136.                         actualProgress = 0;
  137.                         numCargados++;
  138.                         onLoadActualComplete(actualTarget);
  139.                         if (numCargados<targetArray.length) {
  140.                                 load();
  141.                         } else {
  142.                                 //acabamos!
  143.                                 onLoadAllComplete();
  144.                         }
  145.                 }
  146.         }
  147.         /**
  148.         * función que se ejecutará cuando empiece la precarga de
  149.         * algún objeto
  150.         * @param ref
  151.         * una referencia del objeto que se ha cargado
  152.         */
  153.         public function onLoadActualStart():Void {
  154.                 var eventObj:Object = {type:"onLoadActualStart", mc:MovieClip};
  155.                 eventObj.mc = actualTarget;
  156.                 dispatchEvent(eventObj);
  157.         }
  158.         /**
  159.         *
  160.         * @usage función que se ejecutará cuando termine la precarga de
  161.         * algún objeto
  162.         * @param ref
  163.         * una referencia del objeto que se ha cargado
  164.         */
  165.         private function onLoadActualComplete(ref:Object):Void {
  166.                 var eventObj:Object = {type:"onLoadActualComplete", mc:Object};
  167.                 //despacho evento
  168.                 eventObj.mc = actualTarget;
  169.                 dispatchEvent(eventObj);           
  170.         }
  171.         /**
  172.         *
  173.         * @usage función que se ejecutará cuando termine la precarga de
  174.         * de el último objeto a cargar
  175.         */
  176.         private function onLoadAllComplete():Void {     
  177.                 var eventObj:Object = {type:"onLoadAllComplete"};
  178.                 //despacho evento
  179.                 dispatchEvent(eventObj);
  180.         }
  181.         /**
  182.         * @usage getter target array
  183.         * los contenidos
  184.         * @return un array de clips
  185.         */
  186.         public function getTargetArray():Array {
  187.                 return targetArray.slice();
  188.         }
  189. }
  190.  
  191.  

Tags: Actionscript · Flash · OOP

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