Buscando tutoriales, ejemplos y demás de como añadir a mi web en flash 2.0 un preloader. Tengo todo montado, una web de unas 10 escenas, ahora mismo esta en funcionamiento, pero como es muy pesada, y cuando alguien entra se queda una pag en blanco hasta que carga, menos de un minuto pero se hace pesado. He pensado en ponerle un preloader. Pero dios mio! Llevo más de diez tutoriales, mil explicaciones, y no consigo que alguien me de las instrucciones para mi preloader.
Mi web esta en AS 2.0 tiene como te digo unas diez escenas, y la primera se llama INTRO Supongo que tengo que crear otra primera escena delante de intro que se llame preloader o como quiera, para que lo primero que cargue sea eso: la precarga! Pero no consigo que esto funcione de ninguna manera. Te pediría que si me puedes explicar paso a paso esto, te lo agradecería, ya que la mayoría de los tutoriales no hablan de una web entera, sino cargar una foto, o una simple película y muchas veces en la misma escena.. Pfff como veras estoy un tanto desesperada.
1 Respuesta
Respuesta de chamanmazate
2
2
chamanmazate, Iván. Lic En Diseño y Producción Publicitaria en la UPAEP Puebla....
Claro que puedo ayudarte. Mira, todos los preloaders funcionan iguales. Es igual que cuando cargas una foto, pero en ves de que se vaya al fotograma 2, se va a la escena 2. 1.- Vas a crear una nueva escena pero va a estar primero que todas las demás escenas. Quedaría algo así: <span style="white-space: pre;"> </span>1)Escena Preloader <span style="white-space: pre;"> </span>2)Escena Intro <span style="white-space: pre;"> </span>3)Escena Contenido <span style="white-space: pre;"> </span>4)Escena secciones <span style="white-space: pre;"> </span>5)Escena final En la escena Preloader vas a meter tu preloader. Básicamente un preloader funciona de la siguiente manera: <span style="white-space: pre;"> </span>a) Es un ciclo (bucle) que dentro del mismo frame, lee una y otra ves los bytes que se están cargando, comparandolos con los bytes TOTALES que ya están cargados. <span style="white-space: pre;"> </span>b) El ciclo siempre está preguntando si los bytesCargados son iguales a los bytesTotales, entonces se ejecutará la orden de "play();" o sea que empieza a correr la película. De lo contrario siempre estará contando y contando y preguntado hasta que la orden se cumpla. <span style="white-space: pre;"> </span>c) En la primera escena vas a colocar un stop(); ¿Que es lo que pasaría? La escena esta en alto, y entonces se comienza a ejecutar tu preloader. La función va preguntando si los bytesCargados son igual o mayor a los bytesTotales, y cuando se cumpla esta condición, se va a ejecutar la orden de play. que nos va a llevar a la escena 2 automáticamente. Hasta ahí va todo claro? 2.- Ahora vamos a usar la función setInterval(); La función setInterval nos sirve para crear el bucle o intervalo que va a estar preguntando continuamente si la condición se cumple o no. Después de haber colocado un stop(); vamos a crear una variable. ¿Ké es una variable? Es cualquier cosa que queramos que AS entienda, puede tener el nombre que quieras. Hasta ahora nuestro código se vería así: stop(); var carga:Number = setInterval(cargador , 50); ______________________________________ Le vamos a llamar a nuestra variable "cargador" y esta variable se va a convertir en un número, y el setInterval va a llamar a una función que se llama "cargador". 3.- Ahora vamos a crear una función llamada "cargador" se declara de la siguiente manera: function cargador ():Void { } Void nos dice que no nos regresará nada. 4.- Ahora vamos a crear variables que vamos a integrar en nuestra función, esto con el fin de que se nos facilite la sintaxis para futuras ocasiones. Declaramos 2 variables, la variable que llamaremos "bytesCargados" y la variable que llamaremos "bytesTotales" aquí vamos a usar dos propiedades de flash, getBytesLoaded(); y getBytesTotal, esto para calcular los bytesCargados y los bytes totales. Lo que nos interesa a nosotros es saber que porcentaje se va cargando, si recuerdas tus clases de primaria, para sacar un porcentaje se hace una regla de 3 simple. Aquí también vamos a hacer una regla de 3 simple para conocer el porcentaje. Nuestro script se vería de la siguiente manera: ______________________________________________________________ stop(); var carga:Number = setInterval(cargador , 50); function cargador ():Void { var bytesCargados = _root.getBytesLoaded(); var bytesTotales = _root.getBytesTotal(); var porcentaje:Number = Math.round(bytesCargdos/bytesTotales*100); //Aquí arriba es donde se hace la regla de 3 simple para sacar el porcentaje que se va cargando. } _______________________________________________________________ Por último vamos a crear la condición, decimos: Si los bytesCargados son menor o igual que los bytesTotales, entonces borra el setInterval y has play(); El código se vería de la siguiente manera: ______________________________________________________________ stop(); var carga:Number = setInterval(cargador , 50); function cargador ():Void { var bytesCargados = _root.getBytesLoaded(); var bytesTotales = _root.getBytesTotal(); var porcentaje:Number = Math.round(bytesCargdos/bytesTotales*100); if (bytesCargdos >= bytesTotales) { clearInterval(carga); play(); } } _______________________________________________________________ No copies y pegues nada porqué si copias y pegas no te va a salir. Ahora si todo está saliendo bien cuando corras tu película, te va a salir una pantalla en blanco, pero después de un rato se va a ir a la siguiente escena de tu página. Si quieres ponerle una barra de carga o un texto de carga, revisa tus otros tutoriales de internet, lo que puedes hacer de momento es colocar un dinamic text y colocar en el nombre de instancia el nombre de "txt" (sin comillas). Tu código se vería de la siguiente manera: ______________________________________________________________ stop(); var carga:Number = setInterval(cargador , 50); function cargador ():Void { var bytesCargados = _root.getByteLoaded(); var bytesTotales = _root.getBytesTotal(); var porcentaje:Number = Math.round(bytesCargdos/bytesTotales*100); txt.text = "cargando" + porcentaje + "%"; if (bytesCargdos >= bytesTotales) { clearInterval(carga); play(); } } _______________________________________________________________ El txt es un cuadro de texto dinámico, lo dibujas con la herramienta de texto, y le colocas el nombre de instancia "txt" si te das cuenta la palabra porcentaje no está entre comillas, porqué es la variable que obtenemos. Lo que vale de esta programación es el porcentaje, porqué lo que hace esta función es sacar un porcentaje. Si quieres colocar una barra de carga u otra cosa lo puedes hacer con la palabra porcentaje, ahora ya sabes como hacer un cargador. Revisa tus otros tutoriales si tienes dudas. Y si necesitas ayuda, no dudes en consultar. Saludos. Atte:. Chaman Mazateco Próximamente estrenaré mi página web estén pendientes
De verdad, ¿cómo se agradece esto? ¿Solo con unos puntos? Oye de verdad, muchísimas gracias, me has salvado la vida! Ya lo tenía medio avanzado al leer tu respuesta, pero me faltaban pasos clave para completarlo! GENIAL! Volveré a usar el foro si me encuentro con algún problemilla. Muchísimas gracias. Un saludo