Bienvenido a Klr20mg

Cronicas de un desarrollador

Actualmente soy Jefe de Desarrollo del area Flash en Sapotek de México en la cual trabajo desde hace mas de 4 años. Desarrollando aplicaciones en Flash para Web mas comúnmente llamadas (RIAs)

Estas en : Blog » Clase Preload
  • Decrease font size
  • Default font size
  • Increase font size
  • color default
  • color verde
  • color azul
Clase Preload
AddThis Social Bookmark Button
Post2PDF Print
June 7th, 2004

Bueno no es un secreto que lo que la gente que comienza con Flash su pregunta mas frecuente es ¿como hago un preload? :P

Aqui pongo un ejemplo que usa el objeto MovieClipLoader, este ejemplo funciona mediante una Clase llamada preload

Los archivos fuente AQUI

CODE:
  1. class preload{
  2.     var formato : TextFormat ;
  3.     function preload (){
  4.         this.formato = new TextFormat ();
  5.         this.formato.font = "Verdana";
  6.         this.formato.size = 10;
  7.         this.formato.bold = true;
  8.         this.formato.color = 0x990000;
  9.     };
  10.     function makeBox (tmp_mc : MovieClip, ancho : Number, largo : Number, p : Number, col : String, x : Number, y : Number) : MovieClip{
  11.         var tm_mc = tmp_mc.createEmptyMovieClip ("temp" + p, p);
  12.         tm_mc._x = x;
  13.         tm_mc._y = y;
  14.         tm_mc.lineStyle (1);
  15.         tm_mc.beginFill (col);
  16.         tm_mc.lineTo (0, 0);
  17.         tm_mc.lineTo (0 + largo, 0);
  18.         tm_mc.lineTo (0 + largo, 0 + ancho);
  19.         tm_mc.lineTo (0, 0 + ancho);
  20.         tm_mc.lineTo (0, 0);
  21.         tm_mc.createTextField ("caja_txt", 1001, 0, 10, 0, 0);
  22.         tm_mc.caja_txt.autoSize = true;
  23.         tm_mc.caja_txt.type = "dynamic";
  24.         tm_mc.caja_txt.text = "Esperando Buffer";
  25.         tm_mc.caja_txt.setTextFormat (this.formato);
  26.         return tm_mc;
  27.     };
  28.     function doLoad (t : MovieClip, url_path : String, antiCache : Boolean, x : Number, y : Number){
  29.         var aqui = this;
  30.         var holder = t.createEmptyMovieClip ("h", 1);
  31.         holder._alpha = 0;
  32.         var barra = this.makeBox (t, 5, 300, 10, "0x990000", x, y);
  33.         barra._xscale = 1;
  34.         var my_mcl = new MovieClipLoader ();
  35.         var my_mcl_listener = new Object ();
  36.         my_mcl_listener.onLoadProgress = function (t, bl, bt){
  37.             var p : Number = (bl / bt) * 100;
  38.             barra._xscale = p;
  39.             barra.caja_txt.text = "Cargando " + Math.round ((p * 100) / 100) + "%";
  40.             barra.caja_txt.setTextFormat (aqui.formato);
  41.         };
  42.         my_mcl_listener.onLoadComplete = function (){
  43.             barra._visible = false;
  44.             barra.caja_txt._visible = false;
  45.             aqui.fadeIn (holder);
  46.         };
  47.         my_mcl.addListener (my_mcl_listener);
  48.         url_path = (antiCache) ? url_path + "?a=" + new Date ().getTime () : url_path;
  49.         trace (url_path);
  50.         my_mcl.loadClip (url_path , holder);
  51.     };
  52.     function fadeIn (holder : MovieClip){
  53.         holder.onEnterFrame = function (){
  54.             trace(holder._alpha)
  55.             if (holder._alpha <100){
  56.                 holder._alpha += Math.ceil ((100 - holder._alpha) / 10);
  57.             }else{
  58.                 delete holder.onEnterFrame;
  59.             };
  60.         };
  61.     };
  62. };

uso

CODE:
  1. Stage.scaleMode = "noScale";
  2. var carga:preload = new preload();
  3. /*parametros
  4. MC:  donde se creara el Preload
  5. url : el SWF o JPG a cargar
  6. AntiCache: Boolean true o false
  7. x: posicion x de preload
  8. y: posicion y del preload
  9. */
  10. carga.doLoad(this, "http://klr20mg.com/archivos/fondo3.jpg", true, 50, 100);

Comentarios

16 Comentarios en “Clase Preload”

-Podrias explicarme paso a paso como hacer el preload para imagenes, es que soy novato en flash y solo con el codigo nome queda clara la cosa.

Jose Antonio escribio el 7-June-2004 a las 4:37 pm

felicidades a los 3 por este nuevo proyecto, y adelante !! suerte!!!

dagoNauta#135

dago135 escribio el 7-June-2004 a las 6:17 pm

Tmeister esta usando clases, me gustaria colaborar con un preloader tipico.

Primero crea un campo de texto dinámico, pone en VAR porcentaje y posteriormente creala movieClip dentro crea un circulo (puedes crear lo que quieras) pero yo cree un circulito chico y lo hice MC (movie Clip), ponle el nombre de instancia loadBar.

Regresate salte de la Mc y vete a la escena principal, y da click a tu MC con el boton derecho del mouse y pon el siguiente Code.

CODE:
  1. onClipEvent (enterFrame) {
  2.     loading = _parent.getBytesLoaded();
  3.     total = _parent.getBytesTotal();
  4.     percent -= (percent-((loading/total)*100))*.25;
  5.     per = int(percent);
  6.     porcentaje = per+"%";
  7.     loadBar._width = per;
  8.     if (percent>99) {
  9.         gotoAndPlay(2);
  10.     }
  11. }

salu2

Quiza escribio el 8-June-2004 a las 4:39 pm

felicidades en su nuevo emprendimiento, espero que dure mucho tiempo

alexei escribio el 10-June-2004 a las 4:35 pm

Sobre la clase MovieClipLoader lei que tenia un bug que afectaba a algunos navegadores, así que al final decidí no usarla, no se si vosotros estabais enterados de esto...

En fin, sobre el ejemplo que habeis puesto deciros que es buenisimo XD.

Un saludo

Raúl Jiménez escribio el 11-June-2004 a las 2:21 am

Asi es, se comento algun tiempo, la discucion fue larga sobre este asunto, yo hice varias pruebas en varios navegadores con varios sistemas y nunca pude reproducir dicho error.

En si el que dio a conoces este bug fue Freddy de CristaLab pero te repito nunca pude reproducirlo.

Si alguien tuvo este problema que postee para saber si realmente existe dicho bug

Saludos!! 8)

Tmeister escribio el 11-June-2004 a las 9:57 am

Hola, quiero saber como haces para dejar un flash de fondo completo en una pelicula y otros swfs encima ?? como en el ejemplo del load que tienes , le doy click con el boton derecho a cualquier parte del browser y me dice que es es siempre flash sin aparecert la ventanita tipica de windows (ver codigo, guardar fondo , etc...)

Felipe de la fuente escribio el 11-June-2004 a las 10:42 pm

El bug existe, y existe pero q mu bien, en navegadores concretos, te qedas con un par de narices, ya que al no hacer bien la precarga te encuentras con una pagina en blanco totalmente, con lo que el chasco es tremendo, no utiliceis este objeto si no quereis dejar a bastante gente sin ver vuestra web, es un objeto muy util pero a la vez peligroso.Por lo menos hasta que la gente de macromedia lo solucione.Un saludo.

bug bug escribio el 14-June-2004 a las 4:48 am

Muy bien, al parecier esto no es un rumor... pero no especificas bien en que "Navegadores concretos"..

Si pudieras decir cuales son para poder hacer pruebas..

Saludos!!

Tmeister escribio el 14-June-2004 a las 9:37 am

He encontrado una información bastante útil sobre alguien que probó a fondo el movieClipLoader. Este documento ha sido extraído de las listas de correo de http://www.5dms.com

Navegador: Mozilla Firefox
¿Que funciona?
* onLoadStart ok
* onLoadComplete ok
* onLoadProgress ok
¿Que no funciona?
Nada

Mozilla 1.7 a
¿Que funciona?
* onLoadStart ok
* onLoadComplete ok
* onLoadProgress ok
¿Que no funciona?
Nada

Mozilla 1.6 y versiones anteriores (Incluidos los Netscape)
¿Que funciona?
* onLoadStart ok
* onLoadComplete ok
¿Que no funciona?
La variable "totalBytes" de onLoadProgress mantiene el mismo valor que "loadedBytes", haciendo el resultado de un calculo de porcentaje siempre 100

Internet Explorer 6.028 y posterior
¿Que funciona?
* onLoadStart ok
* onLoadComplete ok
* onLoadProgress ok
¿Que no funciona?
Nada

Internet Explorer 6.026, 5 y anteriores
¿Que funciona?
* La variable "loadedBytes" de el evento onLoadProgress
* onLoadComplete ok
¿Que no funciona?
* El evento onLoadStart
* La variable "totalBytes" del evento onLoadProgress

Opera 7.23
¿Que funciona?
* La variable "loadedBytes" de el evento onLoadProgress
* onLoadComplete ok
* onLoadStart ok
¿Que no funciona?
La variable "totalBytes" del evento onLoadProgress

Esto fue probado en sistemas operativos Windows 2000, Me, XP y 2003; en Linux fue imposible porque para este solo ha salido el Flash Player 6.0r89 y en Mac porque no tengo.

Se probó usando el Flash Player 7.0.19 y 7.0.14 sin encontrar ninguna diferencia en ambos; sobra decir que funciona perfecto desde el IDE de Flash. También funciona perfecto cuando en vez de JPG, se cargan SWFs.

Navegadores que faltan probar

* Konqueror
* Opera, versiones viejas
* Mozilla Firebird, Phoenix y versiones viejas
* Safari (Que usa el motor de konqueror KHTML)
* Internet Explorer para Mac
* Otros

Espero que os sea de utilidad, un saludo!!

Raúl Jiménez escribio el 18-June-2004 a las 5:43 am

esta muy padre esta clase.. realmente me a sorprendido la facilidad de uso

sneaker escribio el 24-June-2004 a las 7:00 pm

Hola estoy intentando realizar el script del preloader en mi Flash MX pero no puedo cargar el archivo fuente .fla de Tmeister, ¿solo vale para el Flas MX 2004? ¿necesito actualizar mi Flash?

Kirnem escribio el 26-June-2004 a las 5:25 am

hola gente yo tengo un problema con un preload la verdad no soy muy diestro en actionscript de hecho que empece hace poco a codearme con el

okey el problema es el siguente
tengo una galeria de fotos creada en actionscript todo el contenido se carga externamente por lo cual si le pongo un preloader lo que me precarga son los 2k que pesa el swf no el contenido que carga en el

aca les dejo el codigo

//crea un varible que es un movie clip y se llama mcImage
var mcImage:MovieClip;
//la variable del numero de imagenes a cargar
var nImages:Number = 10;

var nLoadedImages:Number = 0;
var mclLoader:MovieClipLoader = new MovieClipLoader();
var oListener:Object = new Object();
var oImageProperties:Object = new Object();
var nTopDepth:Number;

this.createEmptyMovieClip("mcAlbum", this.getNextHighestDepth());

for(var i:Number = 1; i < nImages + 1; i++) {
mcAlbum.createEmptyMovieClip("mcImage" + i, mcAlbum.getNextHighestDepth());
mcImage = mcAlbum["mcImage" + i];
mcImage.createEmptyMovieClip("mcHolder", mcImage.getNextHighestDepth());
//dirreccion de las imageness
mclLoader.loadClip("../fotos/arte/" + i + ".jpg", mcImage.mcHolder);
mcImage._visible = false;
nTopDepth = mcImage.getDepth();
oImageProperties[mcImage] = new Object();
oImageProperties[mcImage].scaled = false;
mcImage.onRollOver = function():Void {
if(!oImageProperties[this].scaled) {
this.swapDepths(nTopDepth);
clearInterval(oImageProperties[this].nInterval);
oImageProperties[this].nInterval = setInterval(scaleImage, 50, this, 1, 30);
}
};
mcImage.onRollOut = function():Void {
if(!oImageProperties[this].scaled) {
clearInterval(oImageProperties[this].nInterval);
oImageProperties[this].nInterval = setInterval(scaleImage, 50, this, -1);
}
};
mcImage.onRelease = function():Void {
clearInterval(oImageProperties[this].nInterval);
if(oImageProperties[this].scaled) {
oImageProperties[this].nInterval = setInterval(scaleImage, 50, this, -5);
oImageProperties[this].scaled = false;
}
else {
oImageProperties[this].nInterval = setInterval(scaleImage, 50, this, 5, 100);
oImageProperties[this].scaled = true;

}
};
}

oListener.onLoadInit = function(mcHolder:MovieClip):Void {
nLoadedImages++;
mcHolder._x = -mcHolder._height/16;
mcHolder._y = -mcHolder._width/16;
if(nLoadedImages == nImages) {
doLayout();
}
};

mclLoader.addListener(oListener);

function doLayout():Void {
var nX:Number = 0;
var nY:Number = 0;
var mcImage:MovieClip;
for(var i:Number = 1; i < nImages + 1; i++) {
mcImage = mcAlbum["mcImage" + i];
mcImage._xscale = 25;
mcImage._yscale = 25;
mcImage._x = nX;
mcImage._y = nY;
nX += mcImage._width + 5;
//cuantas de ancho
if(i % 4 == 0) {
nX = 0;
nY += mcImage._height + 5;
}
mcImage._visible = true;
}
//posicion de la album
mcAlbum._x = 10;
mcAlbum._y = 10;
}

function scaleImage(mcContent:MovieClip, nIncrement:Number, nMaxPercent:Number):Void {
mcContent._xscale += nIncrement;
mcContent._yscale += nIncrement;
if(nMaxPercent == 100) {
mcContent._x += (mcAlbum._width/36 - mcContent._x)/2;
mcContent._y += (mcAlbum._height/40 - mcContent._y)/2;

}
if(nIncrement > 0 && mcContent._xscale >= nMaxPercent) {
mcContent._xscale = nMaxPercent;
mcContent._yscale = nMaxPercent;
clearInterval(oImageProperties[mcContent].nInterval);
}
else if(nIncrement < 0 && mcContent._xscale <= 25) {
mcContent._xscale = 25;
mcContent._yscale = 25;
clearInterval(oImageProperties[mcContent].nInterval);
}
updateAfterEvent();
}

si alguno pudiera ayudarme seria de gran ayuda

egranto escribio el 28-December-2004 a las 8:48 am

Me agrada esta pagina pues resuelve dudas que hasta ahora no tenian solución, mi pregunta es como hacer unos botones para una web donde se actualize cada 8 dias esos botones con distintos nombres y links, por ejemplo,.una pagina donde halla 5 descargas con sus titulos y nombres, y que estos sean links para descargarlos y poder cambiar los links y nombres , es esto posible ?gracias por todo y saludos!!!

benson escribio el 20-June-2005 a las 5:08 pm

he..ohayo..
weno tengo desde hace buen tiempo una duda a la ke no he encontrado solucion y lo ke hago es enrredarme.. solo espero alguien kontesto porke veo por las fechas ke eso esta bien dificil.. ._.U

lo ke pasa es ke he vito en varias website trabajados en flash ke si por ejemplo digamos hago click en un boton.. parece un preload ke karga la seccion en la ke entrare...
kisiera saber como hacer esto..

porke estoy haciendo un web en flash y como el archivo es tan pèsado de esta manera disminuiria el tiempo de descarga ya ke las secciones se cargarian solo cuando el usuario entra a dicha seccion...
arigato..

Dark Hiusaki escribio el 1-June-2006 a las 10:12 am

Hola a todos,

me ha gustado la galería de fotos de EGRANTO. Me gustaría saber si al final conseguiste solucionar el problema q tenías.
También me gustaría q volvieras a postear el código, y a poder ser q me explicaras los elemetos q tienes en la librería pq he ejecutado el código con el mc vacio: mcImage y no me funciona. No sé si me falta algún elemento en la librería o bien q hay alguna incorrección en el código q posteaste.

Gracias y un saludo a todos

:-)

PD: si alguien hizo alguna otra galería de fotos, me interesaría tb verla.

andrea escribio el 20-June-2006 a las 4:36 am

Leave a Reply

 Blog editado por:

Enrique Chavez aka Tmeister
Si los codigos de este sitio te han ayudado y gustas ayudar de alguna forma:

 Compra Links

 Suscribete


AddThis Social Bookmark Button

 Archivo

2008
2007
2006
2005
2004