Precarga

guachuminga · #1 (**permalink**) 17/02/2006, 09:20

Hola a todos:
Necesito que alguien de buen corazón me explique por favor como hacer una precarga de esas que dicen el porcentaje de avance.....
He buscado en la web y he probado con diferentes tutoriales pero nunca me resulta del todo

........(las de aqui también las vi)
Y también por favor que me explique como puedo verla funcionando ¿debo necesariamente subirla a la web? ¿o puedo verla desde mi computador?

de antemano muchas gracias

lucasiramos · #2 (**permalink**) 17/02/2006, 10:50

Hola guachiminga, voy a tratar de explicarlo lo mas claro posible:

Lo primero es crear tres capas: Stop, cargador y contenido. La primera tendra un stop para detener la peli, la segunda tendra el cargador, y en la tercera colocaremos el contenido de la pagina:

Seleccioná la capa Cargador y dibujá un rectangulo como lo indica la imagen:

En la misma capa, dibuja una caja de texto con la herramienta texto, este tiene que ser una caja de texto dinámica:

Luego con la herramienta de Selección (flechita negra) selecciona el cuadro y la caja de texto:

Convertí a MovieClip esos dos objetos presionando la tecla F8, te va a aparecer el siguiente cuadro. Ponele un nombre de instancia, yo le puse precarga (que original

):

Te va a quedar el movieclip creado, entra a este haciendo doble click en el mismo. Con la herramienta selección, elegí el campo de texto y ponele como nombre de instancia "porcentaje" (ojo con las mayúsculas y minúsculas, tiene que ser así, sin mayúsculas):

Ahora seleccioná solo el contenido de la barra haciendo un solo click en el relleno. Apreta F8 para convertirlo a Movieclip y ponele nombre de instancia "barra" (también en minúsculas). OJO!!! Fijate el registro, es el cuadro del medio a la izquierda. Seleccionalo haciendo click en él:

Salí de la edición del movieclip haciendo click en Escena 1, en la linea de tiempo:

Luego, seleccioná el movieclip, presiona F9 para abrir la ventana de código AS y pegá lo siguiente:

Código:

onClipEvent (enterFrame) {
	with (_parent) {
		porcentaje = Math.round((getBytesLoaded()/getBytesTotal())*100);
		this.barra._xscale=porcentaje;
		porcentaje_txt.text = porcentaje+"% Cargado";
		if(porcentaje == 100){
			gotoAndPlay(_currentframe+1);
		}
	}
}

Por último, agrega un keyframe (con F6) en el segundo frame de la capa stop y colocale el código stop(); esto evitará que cargue de nuevo el preloader. Podes, para probarlo, agregar una imagen en la capa contenido, fijate en la imagen:

Para probarlo hacé Control+Enter, luego nuevamente Control+Enter para realizar una simulación en tu pc de como se vería en Internet, y ... ¡voilá! tu cargador funcionando (esperemos...).

Cualquier cosita postea, espero que te haya servido.
Saludos. Lucas

Viero · #3 (**permalink**) 17/02/2006, 13:31

Mas Facil no puede ser ....
yo creo que muchos de nosotros te agradecemos esto....
*****GRACIAS*****

guachuminga · #4 (**permalink**) 17/02/2006, 15:10

Lucasiramos:
¡¡muchas gracias!! tremenda explicación......eso era justo lo que necesitaba..bien didáctico....
Ahora, perdona lo torpe que soy para estas cosas.....pero es que además no soy programador........

pero no me resulta!!!!
seguí tus instrucciones al pié de la letra... lo hice exactamente igual y no pasa nada, no sé ve la precarga, salta inmediatamente al contenido. (Este último lo probé de 2 maneras, con una imagen como sugerias tú y con una peli a medias que tengo por ahí, y no....no hay caso....)

También pensé que en el código hay una variable que es porcentaje_txt...que no nombranos en ninguna parte de nuestra peli....¿será eso?
O también pensé que no había entendido bien donde tenía que poner el código exactamente... no sé.....

Tenme paciencia por favor, yo sé que estoy cerca de lograrlo..

Muchisimas Gracias otra vez

-=ArgoN=- · #5 (**permalink**) 17/02/2006, 16:00

Creo que te salta directamente porque lo estas probando en tu PC y lo carga casi al instante. Tienes 2 opciones:

Subirlo a un servidor y probar la descarga
Cuando lo publicas desde el flash sigue estos pasos:
- Ver
- Configuracion de descarga
- Ahi seleccionas la que mas rabia te de ^^ Por ejemplo 56K...
- Otra vez: Ver
- Simular descarga

Espero que sepas encontrarlo =)

ArgoN

SAPINTO · #6 (**permalink**) 17/02/2006, 18:32

muy buen metodo mi compadre lucas

, mas tendremos que tener en cuenta que si utilizamos componentes, flash por defecto los carga en el primer frame, por lo que la precarga no se mostrará hasta que los haya cargado (tal vez a algunos la precarga no se muestra hasta el 20% o 16%, bien, es por lo mismo).

para evitar esto, necesitamos exportar los componentes en el segundo frame desde la libreria (linkage: desactivar "export en first frame") y en opciones de publicacion (en la pestaña "action script version": settings "export frames for classes", sale por defecto el 1, entonces, marcar el 2 frame), por lo que es conveniente iniciar nuestra pelicula en el 3 frame.

so, lo unico que hay que modificar en tu codigo es:

Código:

if(porcentaje == 100){
			gotoAndPlay(3);
		}

es mi pequeño, pero no menos importante aporte....

-=ArgoN=- · #7 (**permalink**) 17/02/2006, 19:37

Hum eso del frame 3 no lo entendi del todo... Si ponemos que exporte los componentes en el frame 2 ya serviria no? Frame 1 precarga --> Frame 2: todo lo otro...

Buscando por ahi me encontre esto:

Cita:

"Se añaden activos al fotograma 2 por dos motivos:

Para que todos los activos se copien automáticamente a la biblioteca y estén disponibles para crear dinámicamente una instancia y acceder a sus métodos, propiedades y eventos.
Para asegurarse, mediante la colocación de activos en un fotograma, de que se cargan sin problemas mientras se reproduce la película, evitando tener que establecer la exportación de activos de la biblioteca antes del primer fotograma. Este método evita un pico inicial de transferencia de datos que podría provocar demoras o pausas largas durante la descarga."

Hum quizas esto lo diga para peliculas sin precarga y al añadir precarga habria que correrlo todo un frame. ... pero... si hemos puesto la precarga en la segunda escena tambien influye o una escena cuenta como si fuera un frame?

ArgoN

pulento · #8 (**permalink**) 18/02/2006, 05:05

Tambien puedes hacer que el API de flash lo dibuje por ti y listo.

-----------------------------------------------------------------------

Pon este code en el primer frame y todo lo que quieras poner demas debe partir desde el segundo frame.

Código PHP:

  /***************   preloader by pulento *****************/

 
MovieClip.prototype.preloader = function(){

    

 var loading= "% Loading..";

 _root.createEmptyMovieClip("bar",-100);//aqui dibujamos el color interior del preloader

 _root.bar.lineStyle(.1,0x808000,0);

 _root.bar.beginFill(0x808000,100);

 _root.bar.moveTo(0,0);

 _root.bar.lineTo(0,2);

 _root.bar.lineTo(100,2);

 _root.bar.lineTo(100,0);

 _root.bar.lineTo(0,0);

 _root.bar.endFill();

 _root.bar._x=300//270;

 _root.bar._y=120;//300

 
 _root.createEmptyMovieClip("ramme",1);//aqui dibujamos el marco alrededor del la barra

 _root.ramme.lineStyle(1,0x464600,100);

 _root.ramme.moveTo(0,0);

 _root.ramme.lineTo(0,3);

 _root.ramme.lineTo(104,3);

 _root.ramme.lineTo(104,0);

 _root.ramme.lineTo(0,0);

 _root.ramme._x=300;

 _root.ramme._y=119;//299

 
 myFormat = new TextFormat();//creamos el formato del texto

 myFormat.font = "Verdana";

 myFormat.color = 0x999900;

 myFormat.bold = false;

 myFormat.size = 9;

 
 _root.createEmptyMovieClip("tekst",2);//aqui creamos el texto que mostrara el porcentaje

 _root.tekst.createTextField("fjeld",50,50,50,20,20);

 _root.tekst.fjeld.setNewTextFormat(myFormat);

 _root.tekst.fjeld.autoSize = true;

 _root.tekst._x=355;

 _root.tekst._y=62;

 
 _root.createEmptyMovieClip("control",3);//denne styrer hele proces

 
 _root.control.onEnterFrame = function() {//aqui escalamos es color interior y el texto

  var b_total = getBytesTotal();

  var b_loaded = getBytesLoaded();

    if (b_loaded >= b_total) {

        unloadMovie(_root.bar);//se eliminan los mc cuando ya no son necesarios 

        unloadMovie(_root.ramme);//se eliminan los mc cuando ya no son necesarios 

        unloadMovie(_root.tekst);//se eliminan los mc cuando ya no son necesarios 

    _root.gotoAndStop(3);

        

    } else {

        myPorcent = (b_loaded/b_total)*100;

        _root.bar._xscale = myPorcent;

        _root.tekst.fjeld.text = Math.floor(myPorcent) + loading;

    }//else

 }//onEnterFrame

}//preloader

_root.preloader();

/********************  fin preloader  *****************************************/

Prueba y me cuentas.

Salu2

guachuminga · #9 (**permalink**) 20/02/2006, 11:07

Ignorando lo elevada que se puso la conversación (para mis limitados conocimientos...claro está

).
Quería agradecer nuevamente a lucasiramos y a argon.......
me resultó perfectamente luego que lo subí a la web......

mil gracias.

sólo me queda una preguntita......
¿alguién sabe como hacer para que mientras cambia el número de porcentaje......la palabra "cargados" no baile junto con el número?

son el mejor foro de la web

SAPINTO · #10 (**permalink**) 20/02/2006, 11:10

alinea el texto dinamico a la derecha

pulento · #11 (**permalink**) 20/02/2006, 13:34

.

guachuminga .. no te asustes por el code, si te fijas es solo la parte mas basica del API de flash.
Ademas una vez que lo dominas.. te daras cuenta que dibujando en forma dinamica te baja el peso del flash en forma mas que considerable.

Salu2

.

guachuminga · #12 (**permalink**) 20/02/2006, 14:23

gracias a los dos.....eso era....

al código no le tengo susto...... sólo que me lia un poco.

mil gracias por la paciencia...

-=ArgoN=- · #13 (**permalink**) 27/02/2006, 09:26

lucasiramos, te falto un paso muy importante:
- Guardar el documento cada vez que hagas algo importante.

Lo digo porque en todas las imagenes pone: Sin Título-3*

Buen trabajo

ArgoN

lucasiramos · #14 (**permalink**) 27/02/2006, 09:50

Cita:

Iniciado por -=ArgoN=-

lucasiramos, te falto un paso muy importante:
- Guardar el documento cada vez que hagas algo importante.

Lo digo porque en todas las imagenes pone: Sin Título-3*

Buen trabajo

ArgoN

Jajaja muy pero muy cierto!!!

. Importante ir guardando el archivo de vez en cuando.

Me alegro que sirva la explicación.

Saludos. Lucas

Garto-la · #15 (**permalink**) 06/03/2006, 02:44

muy bueno! pero en la explicación de lucasiramos, hay un error! para que te salga el texto del "xx% Cargado", según el código que hay, el cuadro de texto dinámico debería llamarse porcentaje_txt, tal y como dice guachuminga.

cogombo · #16 (**permalink**) 25/03/2006, 11:57

Cojonudo, arregalndo eso va de lujo.

djwarez · #17 (**permalink**) 25/04/2006, 18:49

Entonces hay error o ohay error.?

Deladevians · #18 (**permalink**) 25/04/2006, 23:30

gracias¡¡¡

Monje · #19 (**permalink**) 26/04/2006, 04:02

Lucas y Pulento...MIL GRAX

Saludos al foro

Mono-R · #20 (**permalink**) 26/04/2006, 08:04

Muy buen intercambio de opiniones, muy constructivo.
Gracias por desburrarnos!!!

rafaconpu · #21 (**permalink**) 29/09/2006, 15:52

¿Y sería posible que el preloader estuviese en una escena y que al cargarse del todo (100%) se pasara a la escena 2 donde esté el contenido de la página?

Vamos, pregunto si es posible porque no tengo ni idea y si lo fuese, ¿qué habría que modificar en el código?
Gracias.

Bandit · #22 (**permalink**) 29/09/2006, 17:35

Hola rafaconpu:
Si estás usando el código de pulento, en ésta línea: _root.gotoAndStop(3); lo cambias por la etiqueta del primer frame de la escena 2.
Te sugiero que mejor no uses varias escenas en una misma película.

Espero haberte sido de ayuda.

trillofer1986 · #23 (**permalink**) 08/10/2006, 18:03

Gente, segui todos los pasos al pie de la letra... Le agregue una foto en la capa "contenido" pero no entiendo porq no veo la precarga, no se si el archivo es muy chico y pasa muy rapido o simplemente no se ve, como puedo hacer para que se vea si o si? esto me pasa cuando exporto la pelicula.

Cuando lo quiero ver desde el flash, si hago ctl+enter... se me ve directamente la foto, y si hago ctl+enter otra vez... veo la barra que cree (la de color) inmovil por unos segundos y despues veo la foto...

Alguien me puede ayudar? estoy aprendiendo flash medio a los golpes jaja

Gracias al foro que me da muchisimos ejemplos y me responde las dudas!!!

Saludos!

PS: pueden adjuntar algun ejemplo de como quedaría la precarga? MIL GRACIAS!!

Bandit · #24 (**permalink**) 09/10/2006, 09:28

Hola trillofer1986:
Debes de haber hecho algo mal, el código de pulento está bien, simplemente copia ese código en el primer frame de la escena 1, creas la escena 2 y en el primer frame coloca una etiqueta, por ejemplo: foto. y allí pones la imagen.
En el código allí donde dice: _root.gotoAndStop(3); escribe: _root.gotoAndStop("foto");.

Espero haberte sido de ayuda y ahora esté más claro.

sbeltran · #25 (**permalink**) 15/10/2006, 15:54

Hola muchachos, desde que los encontre, he logrado solucionar muchos problemas, son geniales.

Bueno, siempre he querido hacer un preloader y nunca he tenido exito. Busqué en todo el foro y encontre este post muy bueno, que explica de un modo muy sencillo.

Pero, haciendo justo lo que lucasiramos hizo, no me da resultado. El resultado que me da es parecido al de trillofer1986.

El resultado que obtuve en la simulación de carga en flash fue: Aparece la barra pero no se carga nada, y luego al rato aparece la imagen.

El resultado que obtuve al montar el archivo .swf en intenet fue: pantalla en blanco, hasta que al fin se logra cargar la imagen y se muestra.

Aquí les envío ambos archivos para que echen una hojeada. En verdad no se en donde estoy cometiendo el error. Les pido ayuda, se que como siempre lograrñan ayudarme.

w vv w.sepiastudio.com/precarga.swf
w vv w.sepiastudio.com/precarga.fla

Espero que gente que no haya visto este post, lo vea, porque quedó en el olvido y esta muy bueno.

Recuerden, me estoy basando bajo el tutorial que dió lucasiramos.

Saludos

Ramispain · #26 (**permalink**) 16/10/2006, 07:32

a mi todavia no me solucionaron nada ¬¬ :P

sbeltran · #27 (**permalink**) 16/10/2006, 14:57

Vamos muchachos, echenos una mano a los nuevos en este asunto, que se nos hace un poco dificil comprender este asunto pero que tenemos todas las ganas de solucionar estas cosillas.

Muchas gracias de antemano

Saludos muchachos

Bandit · #28 (**permalink**) 17/10/2006, 09:12

Hola sbeltran:
La razón porque no funciona tu preloader, es que te haz olvidado de ponerle el nombre de instancia al MC barra y la variable al campo de texto dinámico en el MC precarga.

Espero haberte sido de ayuda.