Comunidad de diseño web y desarrollo en internet online

preloader de imagenes externas capturadas por xml

Citar            
MensajeEscrito el 10 Jul 2008 03:59 pm
bien, el tema creo que con el asunto se descrive ràpido tengo un swf que se crea apartir de un xml i adjunta fotos.
trabajando on line tarda un poco en cargar la imagen por eso estoy creando un preload pero no es como siempre tengo que controlar el xml i decir que controle un nodo como empiezo.
he probado algo sencillo para aparecer un mensaje de cargando hasta que la imagen se carge pero creo que no voy bién. benga tirame un cable porfa
micarga es la instancia de movie clip con el mensage cargando espere

Código :

obranova_xml.load("obranova.xml"); {
obranova_xml.onLoad = function(){
   micarga._visible = false;
         

Por agullana

6 de clabLevel



 

firefox
Citar            
MensajeEscrito el 10 Jul 2008 04:14 pm
Primero tienes que chequear que se haya cargado el XML y después empezar chequear que se han cargado todas las imágenes que contiene el XML, lo mejor es incrementar una variable hasta que llegue a la cantidad de nodos que contiene el XML de las imágenes.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 10 Jul 2008 06:21 pm
[code]this._lockroot = true;
//Permite caracteres tradicionales como letras con tilde la ñ, etc.
System.useCodepage = true;

//Se declara la variable indice de tipo número (utilizada para referencia la noticia a mostrar)
var indice:Number;

//Se declara la variable obranova_xml de tipo XML (utilizada para almacenar el documento xml)
var obranova_xml:XML;

/*
Funcion cargarDatos (utilizada para cargar y cambiar las obranova en el documento)
Esta función recibe un parámetro "_indice" que corresponde al elemento noticia a mostrar
*/
function cargarDatos(_indice:Number){
//Se inicializan variables utilizadas para almenar los datos de una noticia
var fecha:String;
var titulo:String;
var mensaje:String;
var imagen:String;

//Recuperando datos del objeto xml
//Se accede al primer elemento [noticia] y se recupera la fecha desde el atributo [fecha]
fecha = obranova_xml.firstChild.childNodes[_indice].attributes.fecha;

//Se accede al primer hijo de elemento [noticia] y se recupera al valor del primer elemento de [titulo]
titulo = obranova_xml.firstChild.childNodes[_indice].firstChild.firstChild.nodeValue;

//Se accede al segundo hijo de elemento [noticia] y se recupera el valor del primer elemento de [mensaje]
mensaje = obranova_xml.firstChild.childNodes[_indice].firstChild.nextSibling.firstChild.nodeValue

//Se accede al último hijo de elemento [noticia] y se recupera el valor del primer elemento de [imagen]
imagen = obranova_xml.firstChild.childNodes[_indice].lastChild.firstChild.nodeValue

//Mostrando los datos recuperados en el cuado de texto mensaje_txt y cargando la imagen en pantalla_mc
_root.mensaje_txt.htmlText = "";
_root.mensaje_txt.htmlText += "<p align='center'><font color='#FEBBA4' size='22'><b>" + titulo + "</b></font></p>";
_root.mensaje_txt.htmlText += "<p><font size='16'>" + mensaje + "</font>";
_root.mensaje_txt.htmlText += "<font color='#000000' size='16'>construit: " + fecha + "</font></p>";
//Cargado la imagen JPG externa en el clip pantalla_mc con el valor recuperado del objeto xml
_root.pantalla_mc.loadMovie(imagen);
}

//Función que permite avanzar a la [noticia] siguiente almacenada en el objeto xml
siguiente_btn.onPress = function(){
//comprobando si existe el siguiente elemento [noticia]
if(obranova_xml.firstChild.childNodes[indice+1] != null){//retringue a avanzar solo si hay una [noticia] siguiente
indice++; //incrementado en uno el indice
cargarDatos(indice); //recuprando y mostrando los datos y la imagen en la pantalla
}
}

//Función que permite retroceder a la noticia anterior almacenada en el objeto xml
anterior_btn.onPress = function(){
//comprobando si existe una elemento [noticia] anterior
if(obranova_xml.firstChild.childNodes[indice-1] != null){//retringue a avanzar solo si hay una [noticia] anterior
indice--; //reducciendo en uno el indice
cargarDatos(indice); //recuprando y mostrando los datos y la imagen en la pantalla
}
}

//Inicializaciones
indice=0; //inicializando indice en 0 para mostrar la primera noticia

//creando el objeto obranova_xml de typo XML
obranova_xml = new XML();

//Permite que el objeto XML ignore los espacios en blanco entre marca y marca del documento XML
obranova_xml.ignoreWhite = true;

//El método load() permite cargar el documento xml "obranova.xml"
obranova_xml.load("obranova.xml");

//El evento onLoad de activa cuado se haya cargado el documento obranova.xml
obranova_xml.onLoad = function(){
//Se llama a la funcion cragarDatos para mostar la primera noticia (esto por la variable indice en 0)
cargarDatos(indice);
}

[/flash]

Por agullana

6 de clabLevel



 

firefox
Citar            
MensajeEscrito el 10 Jul 2008 06:22 pm
perdon esto es todo el codigo pero no se como aplicarlo
gracias

Por agullana

6 de clabLevel



 

firefox
Citar            
MensajeEscrito el 11 Jul 2008 09:02 am
Suponiendo que este sea tu XML:

Código :

<datos>

   <fila nombre="belinda" />
   
   <fila nombre="bolivar" />      
   
   <fila nombre="cabanas" />   
   
   <fila nombre="cohiba" />      
   
   <fila nombre="cuaba" />   
   
   <fila nombre="diplomaticos" />   

</datos>


Una solución para saber cuando se han cargado todas las imágenes sería:

Código :

var contenedor:MovieClip = this.createEmptyMovieClip("contenedor", this.getNextHighestDepth());

//---Leer el XML
var images:XML = new XML();
images.ignoreWhite = true;

images.onLoad = function(success:Boolean):Void{
   
   if(success){
      
      //---Comezar a leer las imágenes
      loadImage(0);
      
   }
   
}

images.load("images.xml");


//---Función de leer las imágenes
function loadImage(n:Number) {
   
   var mcLoader:MovieClipLoader = new MovieClipLoader();
   var listener:Object = new Object();
   
   //---Cuando la imagen se termine de cargar, cargar la siguiente
   listener.onLoadComplete=function(target:MovieClip, httpStatus:Number){
      
      if (n+1 < images.firstChild.childNodes.length) {
         
         loadImage(n + 1);
         
      }else{
         
         trace("se cargaron todas las imágenes en el contenedor");
         
      }
      
   }
   
   var imageName:String = images.firstChild.childNodes[n].attributes.nombre;
   
   mcLoader.addListener(listener);
   
   mcLoader.loadClip("images/"+imageName+".jpg", contenedor);
   
}

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox
Citar            
MensajeEscrito el 13 Jul 2008 07:29 pm
ok gracias por la respuesta m'he ha servido tanto para solucionar el problema como para aprender un poco más. y mil gracias.

Por agullana

6 de clabLevel



 

firefox
Citar            
MensajeEscrito el 23 Dic 2008 01:43 pm
Me parece muy interesante este artículo, por eso les pido si puden mostrar un ejemplo de una galería obtenida a partir de un XML, por ejemplo con dos campos, uno nombreimagen y otro imgmini, y que alcargar se distribuyan en 5 filas con 15 columnas, luego al pasar sobre una imagen que nos muestre el nombre de la imagen.

Estoy desarrollando mi primera web con swishmax 2 enlazada con base de datos, creo un archivo php que me transforma los datos a un xml desde una consulta, es de ahí de donde recojo estos dos campos, pero no he logrado montar el xml funcionando, para mi sería la leche poder mostrar esta galería de productos distribuidos en filas y columans y que encama de todo se cargaran de forma profesional y en perfecto orden.

De momento he probado con este código, pero no he logrado mostrar las imágenes:

onSelfEvent (load) {
var contenedor:MovieClip = this.createEmptyMovieClip("contenedor", this.getNextHighestDepth());
miXML = new XML();
miXML.ignoreWhite = true;
miXML.onLoad = function(exito){
if(exito){
// XML cargado!!
loadImage(0);
extraerDatos(this);
}else{
trace("ERROR: no se econtraron los datos XML");
}

};



// Ver datos del XML
//---------------------------------------
extraerDatos = function (xmlObj){

nodo = xmlObj.childNodes[0]; // tambien puedes usar firstChild en vez de childNodes[0]
//Nº total de prodcutos
totalProductos = nodo.childNodes.length;
trace("Total de productos: " + totalProductos);
for(i = 0; i < totalProductos; i++){
trace("Producto " + (i + 1));
etiquetas = nodo.childNodes[i].childNodes.length;
trace("total de etiquetas:" + etiquetas);
for(n=0; n<etiquetas; n++){
nombreEtiqueta = nodo.childNodes[i].childNodes[n].localName;
valorEtiqueta = nodo.childNodes[i].childNodes[n].firstChild.nodeValue;
trace(nombreEtiqueta + " ==> " + valorEtiqueta);
mc.nombre = nodo.childNodes[i].childNodes[j].firstChild.nombre;
mc.loadMovie("/files/"+nodo.childNodes[i].childNodes[j].firstChild.imgmini);
mc.onRollOver = function() {
this.dropShadowTo(10, 45, 0xff6600, 1, 20, 20, 1, 5, false, false, false, 2);
this.resizeTo(60,60,2,"easeoutelastic");
_root.familia1.text = mc.familia;
trace(_root.mc);
};

mc.onRollOut = function() {
this.dropShadowTo(0, 45, 0xff0000, 0.5, 5, 5, 1, 5, false, false, false, 2);
this.resizeTo(50,50,2,"easeoutelastic");
_root.familia1.text = "Esperando datos...";

};

}
trace("========================================");
//url del componente



}


}


// Cargamos el xml y mostramos los datos en la ventana de debug
miXML.load("send_xml_productos.php");
}


Un saludo amigos.

Por gabriel55

0 de clabLevel



 

msie7
Citar            
MensajeEscrito el 14 Ene 2010 03:42 pm
y como se puede hacer que cargue las imagenes de a uno, es decir, se cargue la foto 1 y la muestre y despues se cargue la foto dos y se muestre y asi susecivamente. No que deba cargar todas para mostrarlas, sino que las cargue de a una.


saludos,
Mianel

Por mianel

20 de clabLevel



 

firefox
Citar            
MensajeEscrito el 15 Ene 2010 12:06 pm
@mianel la función onLoadComplete se ejecuta cada vez que se lee una imagen, dentro de esta función puedes hacer lo que quieras y por supuesto situar cada imagen en diferentes contendores.

Por elchininet

Claber

3921 de clabLevel

17 tutoriales

Genero:Masculino  

Front-end developer at Booking.com

firefox

 

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