Comunidad de diseño web y desarrollo en internet online

Preloading sencillo y completo

Citar            
MensajeEscrito el 18 Ago 2006 01:01 am
Bueno, antes de nada, garantizaros su sencillez, puesto que ha sido hecho por alguién de 14 muuuyyy vago :lol:

ANTES DE NADA: Vista Previa

Empecemos:

Este PRELOADING constará de:
- Una barra de carga
- Un texto de porcentaje
- Un texto con la cantidad de Bytes totales de nuestra animación
- Un texto con la cantidad de Bytes cargados
- Un texto con la cantidad de Bytes que faltan

Empezamos a construir:

Barra de Carga:
Creamos un clip de película de 101 fotogramas y le llamamos "barrita_de_carga" (sin comillas). ¿Por qué 101 y no 100? Por que los que ponen 100, cometen un fallo: cuando llevas un 0%, en la barra de carga, aparece como si llevaras 1. En este caso, el fotograma 1 de la barra, es el 0%; el 2, el 1% ... y el fotograma 101, es el 100%.
En el fotograma nº 101, escribimos:

Código :

_root.play();


Texto de porcentaje:
Creamos un texto dinámico, y dónde dice VAR, ponemos "texto_porcentaje" (sin comillas)

Texto de Bytes Totales:
Creamos un texto dinámico, y dónde dice VAR, ponemos "total" (sin comillas)

Texto de Bytes Cargados:
Creamos un texto dinámico, y dónde dice VAR, ponemos "cargados" (sin comillas)

Texto de Bytes que faltan por cargar:
Creamos un texto dinámico, y dónde dice VAR, ponemos "faltan" (sin comillas)

Ahora ha llegado la hora de poner el Script en el frame de carga. El Script es el siguiente:

Código :

_root.onEnterFrame = function(){
   total = "Bytes en total: " + getBytesTotal();
   faltan = "Bytes por cargar: " + (getBytesTotal() - getBytesLoaded());
   cargados = "Bytes cargados: " + getBytesLoaded();
   porcentaje = Math.floor(getBytesLoaded() * 100 / getBytesTotal())
   texto_porcentaje = "Cargando... " + porcentaje + " % cargado"
   barrita_de_carga.gotoAndStop(porcentaje + 1);
}
stop();


Explicación del Script:

Código :

_root.onEnterFrame = function(){ //Esto hace que lo que pongamos dentro se repita constantemente
   total = "Bytes en total: " + getBytesTotal(); //Esto hace que en el texto "total" aparezcan los Bytes totales
   faltan ="Bytes por cargar: " + (getBytesTotal() - getBytesLoaded()); //Esto hace que en el texto "faltan" aparezcan los Bytes no cargados
   cargados = "Bytes cargados: " + getBytesLoaded(); //Esto hace que en el texto "cargados" aparezcan los Bytes cargados
   porcentaje = Math.floor(getBytesLoaded() * 100 / getBytesTotal()) //Esto calcula el porcentaje sin decimales
   texto_porcentaje = "Cargando... " + porcentaje + " % cargado" //Esto hace que en el texto "texto_porcentaje" aparezca el porcentaje cargado
   barrita_de_carga.gotoAndStop(porcentaje + 1); //Esto hace que la barrita de carga vaya de acuerdo con el porcentaje
} // Fin del bucle o repetición
stop(); //Esto hace que nuestra animación se pare hasta que se cargue totalmente (que es cuando la barra ordena "_root.play();")


Espero que le sirva a todo el mundo ^^ Se aceptan críticas (Por supuesto). Próximamente, imágenes :wink:

Por nestorrente

1010 de clabLevel

10 tutoriales

 



Ultima edición por nestorrente el 18 Ago 2006 03:10 pm, editado 2 veces

Vigo

firefox
Citar            
MensajeEscrito el 18 Ago 2006 02:16 am
esta buena la propuesta, pero hay un detalle, q debes eliminar el evento onEnterFrame para q no siga consumiendo recursos

Código :



var target:MovieClip = this;//....destino o a quien queremos hacer la precarga
var total:Number = target.getBytesTotal();
var cargado:Number;
var porcentaje:Number;
//
this.onEnterFrame = function() {
   cargado = target.getBytesLoaded();
   porcentaje = Math.round((cargado*100)/total);
   trace(porcentaje);
   //barra de loader
   barra._xscale = porcentaje;
   //animacion con 100 frame
   animacion.gotoAndStop(porcentaje);
   if (porcentaje == 100) {
      delete this.onEnterFrame;
      //gotoAndPlay("inicio");
   }
};


Por eldervaz

BOFH

10964 de clabLevel

39 tutoriales
56 articulos

Genero:Masculino  

en algún lugar del mundo

msie
Citar            
MensajeEscrito el 18 Ago 2006 02:48 am
Ah, vale, gracias ^^
Ahora voy a poner como quedaba el PRELOADING de antes. De momento utilizaré el hosting gratuíto imageshack.us, próximamente lo subiré a mi web.

Por nestorrente

1010 de clabLevel

10 tutoriales

 

Vigo

firefox
Citar            
MensajeEscrito el 18 Ago 2006 02:56 am
oe broder ice justamente lo ke dices en el tutorial pero no me sale, me sale este error

**Error** Escena=Escena 1, capa=Capa 1, fotograma=1:Línea 2: La declaración debe aparecer dentro del controlador on/onClipEvent
_root.onEnterFrame=function(){

Total de errores de ActionScript: 1 Errores comunicados: 1

aver si me das una amanito pues
ok

Por useraul

Claber

131 de clabLevel



Genero:Masculino  

Huantalandia

msie
Citar            
MensajeEscrito el 18 Ago 2006 03:00 am
pusiste el code en un movieClip y va en el frame

Por eldervaz

BOFH

10964 de clabLevel

39 tutoriales
56 articulos

Genero:Masculino  

en algún lugar del mundo

msie
Citar            
MensajeEscrito el 18 Ago 2006 03:03 am
ah me olvidaba donde codificas?

Por useraul

Claber

131 de clabLevel



Genero:Masculino  

Huantalandia

msie
Citar            
MensajeEscrito el 18 Ago 2006 01:18 pm

nestorrente escribió:

Ahora ha llegado la hora de poner el Script en el frame de carga. El Script es el siguiente:

Código :

_root.onEnterFrame = function(){
   total = "Bytes en total: " + getBytesTotal();
   faltan = "Bytes por cargar: " + (getBytesTotal() - getBytesLoaded());
   cargados = "Bytes cargados: " + getBytesLoaded();
   porcentaje = Math.floor(getBytesLoaded() * 100 / getBytesTotal())
   texto_porcentaje = "Cargando... " + porcentaje + " % cargado"
   barrita_de_carga.gotoAndStop(porcentaje + 1);
}
stop();

El Script se colocará en el 1er frame o fotograma de la película.

Por nestorrente

1010 de clabLevel

10 tutoriales

 

Vigo

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.