Centrar imágenes en la galería con loadMovie de Ereb

Hola a todos:

Estoy utilizando la galería que Ereb nos enseñó a hacer en su tutorial, y hasta ahora todo ha funcionado no bien, sino mejor: ¡gracias Ereb!

Pero ahora me encuentro con el problema de que tengo que meter en la galería fotos de dos tipos: unas en vertical y otras en apaisado (horizontal). En píxeles unas miden 335x500 y las otras 500x335, más o menos. Usando la galería de Ereb tal y como él la dejó, todas salen alineadas en el vértice superior izquierdo del movieclip contenedor (como era de esperar, claro).

Lo que busco es que queden centradas de una forma sencilla: que las verticales aparezcan desplazadas 55 píxeles a la derecha (_x +55) y que las horizontales otros 55 hacia abajo (_y +55)

He probado de todo (buscar en este "Santo Foro" incluido), pero mi inexperiencia en Flash es demasiada como para saber solucionar este problema.

Para desplazar las imágenes he visto que se puede hacer moviendo el contenedor (puede que sea un poco retorcido, lo sé):

Código :

setProperty(contenedor, _x, getProperty(contenedor, _x)+55)

La pregunta concreta es ¿hay alguna manera de que Flash sea capaz de "leer" las dimensiones de la fotografía, para luego crear una variable que la incluya? Después ¿cómo sería la función que mueva la fotografía?

Si Flash no es capaz de "leer" las dimensiones (cosa que dudo), se me ocurre que podría meter las dimensiones en el txt asociado a la galería (&ancho1=335, &ancho2=500, etc). En tal caso, ¿qué tendría que hacer?.

Muchas gracias de antemano por vuestro tiempo y vuestra ayuda.

Un saludo

Mira este post:

http://www.cristalab.com/foros/t58877_propiedades-de-anchura-y-altura-de-un-movieclip.html

Y este otro:

http://www.cristalab.com/foros/t58777_redimesionar-imagenes-y-movieclip.html

Muchas gracias, chininet!

Con las indicaciones de tu respuesta, más otras respuestas tuyas a otros post, y de otros compañeros del foro he conseguido hacerlo. También leer el manual de AS de Adobe ha venido bien, je je je. Por cierto, he visto que últimamente has dado unas cuantas respuestas sobre MovieClipLoader

Lo dicho: muchísimas gracias

Saludos

P.D.: iba a pegar el código que ha quedado para que lo use más gente que tenga el mismo problema que yo, pero no sé si estaría bien visto en el foro. Si no es así (miraré las normas del foro, por si acaso), que alguien me lo diga y posteo el código en un momento.

Puedes postear la parte respectiva a tu problema específico, así si alguien usa la búsqueda se puede nutrir de tu solución

Genial, pego el código al final del post.

Por cierto, he tenido que modificar cosas de galería original de Ereb. Por ejemplo, Ereb usó un movieclip dibujado a mano y con nombre de instancia "contenedor". Pues bien, como el código que me pasó elchininet crea un nuevo mc, directamente borré el mc de Ereb y dejé el código de elchininet, para hacerme menos líos

Pongo un montón de comentarios, es que soy novato y si no los pongo me pierdo

Creo que todo lo que pongo está bien (al menos a mí me funciona). Si no es así, agradeceré correcciones

Saludos y gracias otra vez

Código :

//la siguiente línea es la última "original" de Ereb. El código modificado es lo que hay debajo
carga.load(archivo);

//carga de la imagen con MovieClipLoader
var contenedor:MovieClip = this.createEmptyMovieClip("contenedor",this.getNextHighestDepth());
var loader:MovieClipLoader = new MovieClipLoader();
var listener:Object = new Object();
//una vez creado el mc contenedor y asignada la clase MovieClipLoader
//creamos un listener que "escuche" al evento onLoadInit
//a partir de ahora el mc tomará las dimensiones del jpg o swf cargado
listener.onLoadInit = function(target:MovieClip):Void{
   //aquí pongo un trace para ver que el movieclip ha tomado las
   //dimensiones de la foto (descomentarlo para hacerlo funcionar)
//trace("el ancho del mc contenedor llamado "+contenedor._name+ "es "+contenedor._width)   

//centramos el contenedor respecto a un mc con nombre de instancia "fondofoto" hecho a mano en Flash, que no está centrado
//en el escenario. Así, si muevo "a mano" el fondofoto, automáticamente las imágenes aparecerán centradas en él
   contenedor._x=((fondofoto._width-contenedor._width)/2)+(fondofoto._x)
   contenedor._y=((fondofoto._height-contenedor._height)/2)+(fondofoto._y)
}
//carga de la imagen que corresponda nada más abrir la galería
loader.addListener(listener);
loader.loadClip(ruta+i+ext, "contenedor")
//esta última línea hay que ponerla también allí donde Ereb ponía "loadMovie(ruta+i+ext, "contenedor"),
//es decir, en el script de los botones anterior y siguiente

Hola Ciruelo, en tu ejemplo del código de arriba que representa la variable "fondofoto" ?

Hola psycho-vnz:

"fondofoto" no es una variable, es el nombre de instancia de un MC que funciona como marco de la foto. Es decir, que la imagen se centrará respecto a este marco y no respecto al escenario.
Con esto consigo tener una referencia visual rápida cuando diseño la galería de forma gráfica para saber dónde va a aparecer la foto, que siempre saldrá centrada en ese marco.
No obstante, y aunque a mí me funciona bien este script, deduzco por tu pregunta que puede que yo haya cometido algún error de sintaxis o de declaración de variables: te estaría muy agradecido si me lo confirmaras.
Un saludo

Ciruelo escribió:

Tu script funciona bien , solo es que tenia esa duda

Ciruelo escribió:

hola, tengo el mismo problema de q las imagenes se cargan en el extremo superior izquierdo del escenario, yo use como FLA base el "Lector de noticias XML en Flash con imagenes" de aki mismo (Cristalab) y le modifque algunos parametros para hacer un "catalogo con imagenes), ahora no llego a entender como resolvistes el problema puesto q tus codigos y los mios casi no se asemejan (tome como ejemplo tu codigo para tratar d q la imagenes me salga bien, pero sin resultados).
Quisiera saber si por favor podrias ayudarme en esto (es q tbm soy novatillo) aki sta el codigo:

fla:

Código :

//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 noticias_xml de tipo XML (utilizada para almacenar el documento xml)
var noticias_xml:XML; 

/*
Funcion cargarDatos (utilizada para cargar y cambiar las noticias 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 año:String;
      var titulo:String;
      var tecnica:String;
      var dimension:String;
      var precio:String;
      var imagen:String;
      
      //Recuperando datos del objeto xml
      //Se accede al primer elemento [noticia] y se recupera la fecha desde el atributo [año]
      año = noticias_xml.firstChild.childNodes[_indice].attributes.año;
      
      //Se accede al primer hijo de elemento [noticia] y se recupera al valor del primer elemento de [titulo]
      titulo = noticias_xml.firstChild.childNodes[_indice].firstChild.firstChild.nodeValue;
      
      //Se accede al segundo hijo de elemento [noticia] y se recupera el valor del primer elemento de [tecnica]
      tecnica = noticias_xml.firstChild.childNodes[_indice].firstChild.nextSibling.firstChild.nodeValue
      
      //Se accede al tercer hijo de elemento [noticia] y se recupera el valor del primer elemento de [dimension]
      dimension = noticias_xml.firstChild.childNodes[_indice].firstChild.nextSibling.nextSibling.firstChild.nodeValue
      
      //Se accede al cuarto hijo de elemento [noticia] y se recupera el valor del primer elemento de [precio]
      precio = noticias_xml.firstChild.childNodes[_indice].firstChild.nextSibling.nextSibling.nextSibling.firstChild.nodeValue
      
      //Se accede al último hijo de elemento [noticia] y se recupera el valor del primer elemento de [imagen]
      imagen = noticias_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='left'><font color='#CECFCE' size='11'><b><font color='#FF9900'><p align='left'>TÍTULO:</p></font>" + titulo + "</b></font></p>";
      _root.mensaje_txt.htmlText += "<br><p align='left'><font color='#CECFCE' size='11'><b><font color='#FF9900'><p align='left'>TÉCNICA:</p></font>" + tecnica + "</b></font></p>";
      _root.mensaje_txt.htmlText += "<br><p align='left'><font color='#CECFCE' size='11'><b><font color='#FF9900'><p align='left'>DIMENSIÓN:</p></font>" + dimension + "</b></font></p>";
      _root.mensaje_txt.htmlText += "<br><p align='left'><font color='#CECFCE' size='11'><b><font color='#FF9900'><p align='left'>PRECIO:</p></font>" + precio + "</b></font></p>";
      _root.mensaje_txt.htmlText += "<br><p align='left'><font color='#CECFCE' size='11'><b><font color='#FF9900'><p align='left'>AÑO:</p></font>" + año + "<b></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(noticias_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(noticias_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 noticias_xml de typo XML
noticias_xml = new XML();

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

//El método load() permite cargar el documento xml "noticias.xml"
noticias_xml.load("emilio.xml");

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

xml:

Código :

<?xml version="1.0" encoding="iso-8859-1"?>
<noticias>
   <noticia año="1998"> 
      <titulo>Autoretrato</titulo>
      <tecnica>Oleo</tecnica>
      <dimension>0,98 x 0,50 m</dimension>
      <precio>S/. 1200.00</precio>
      <image>emilio/imagen1.jpg</image>
   </noticia>
   
   <noticia año="2006"> 
      <titulo>Mujer en la Cama</titulo>
      <tecnica>Madera sobre madera</tecnica>
      <dimension>11,98 x 2,50 m</dimension>
      <precio>S/. 4500.00</precio>
      <image>emilio/imagen2.jpg</image>
   </noticia>
   
   <noticia año="2007"> 
      <titulo>Autoretrato con fondo morado</titulo>
      <tecnica>Oleo sobre Lienzo</tecnica>
      <dimension>5,83 x 1,47 cm</dimension>
      <precio>S/. 3200.00</precio>
      <image>emilio/imagen3.jpg</image>
   </noticia>

   <noticia año="2008"> 
      <titulo>Retrato José Rojas Vásquez</titulo>
      <tecnica>Técnica mixta sobre madera</tecnica>
      <dimension>4,00 x 9,04 cm</dimension>
      <precio>S/. 400.00</precio>
      <image>emilio/imagen4.jpg</image>
   </noticia>

</noticias>

Gracias d antemano por el consejo y sorry si me tomo la libertad de solicitar ayuda de sta forma, es q ando medio desesperado por el tiempo q llevo con esta galeria q no me sale.

Hola, no veo en tu código ningún fragmento del mío, con lo cual no puedo ayudarte.

Respecto a tu MP, los nombres de instancia que uso son sólo dos: contenedor y fondofoto
contenedor es el mc en el que se cargará la foto, y fondofoto es un mc que yo me he creado para poder mover el contenedor dentro del escenario, pero manteniendo las imágenes centradas (yo tengo imágenes en vertical y apaisadas). Esto mismo lo digo en los comentarios que puse en el script:
//centramos el contenedor respecto a un mc con nombre de instancia "fondofoto" hecho a mano en Flash, que no está centrado
//en el escenario. Así, si muevo "a mano" el fondofoto, automáticamente las imágenes aparecerán centradas en él.

No sé si te ha servido de algo. Si es que no, vuelve a preguntar y lo intentamos de nuevo

Saludos

Ciruelo escribió:

Hola, agradezco infinitamente tu interes por ayudarme , tienes razon en el codigo q pege no incluye tu codigo, pero es ahi donde radica mi problema:

Código ActionScript :

//carga de la imagen con MovieClipLoader
var contenedor:MovieClip = this.createEmptyMovieClip("contenedor",this.getNextHighestDepth());
var loader:MovieClipLoader = new MovieClipLoader();
var listener:Object = new Object();
//una vez creado el mc contenedor y asignada la clase MovieClipLoader
//creamos un listener que "escuche" al evento onLoadInit
//a partir de ahora el mc tomará las dimensiones del jpg o swf cargado
listener.onLoadInit = function(target:MovieClip):Void{
   //aquí pongo un trace para ver que el movieclip ha tomado las
   //dimensiones de la foto (descomentarlo para hacerlo funcionar)
//trace("el ancho del mc contenedor llamado "+contenedor._name+ "es "+contenedor._width)   

//centramos el contenedor respecto a un mc con nombre de instancia "fondofoto" hecho a mano en Flash, que no está centrado
//en el escenario. Así, si muevo "a mano" el fondofoto, automáticamente las imágenes aparecerán centradas en él
   contenedor._x=((fondofoto._width-contenedor._width)/2)+(fondofoto._x)
   contenedor._y=((fondofoto._height-contenedor._height)/2)+(fondofoto._y)
}
//carga de la imagen que corresponda nada más abrir la galería
loader.addListener(listener);

Tanto el "loader", "listener" y "target" son acaso "mc"?, si es asi d q manera debo crearlos y asociarlos al actionscript?
Los cree dandole al icono "rectangulo" y luego los converti en simbolo con nombre d instancia igual al nonbre propio d estos ("loader", "listener" y "target"), los vincule con el actionscript: "MovieClipLoader" para loader, "Object" para listener, "MovieClip" para target.
Y para "fonfofoto" hago lo mismo, aun asi no carga ninguna imagen y no me da error en el script, solo se me acumulan MC's en el FLA; se ke lo estoy haciendo mal...
entonces ¿como deberia d ser?
gracias

Antes de nada, me corrijo a mí mismo: el código que posteé no es del todo mío, su autoría original es de Ereb. Al César lo que es del César...
Vamos a ver, que tienes un pequeño lío
En efecto, los únicos MC son "contenedor" y "fondofoto", pero ¡OJO! contenedor lo creo mediante ActionScript:

Código :

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

Ten en cuenta que en esta línea uso el nombre "contenedor" dos veces: la primera para declarar la variable, y la segunda como nombre de instancia del MC creado.
Por otro lado, "fondofoto" sí que es un MC que dibujo a mano. Luego el único MC que tienes que dibujar a mano mediante "el botón del rectángulo" es el fondofoto. NINGUNO MÁS.
"loader" y "listener" son los nombres que asigno a las respectivas variables (fíjate al comienzo de cada línea: con var
se declaran las variables), que no son MC.

Código :

var loader:MovieClipLoader = new MovieClipLoader(); 
var listener:Object = new Object(); 

"target" es un parámetro de la función que asigno a la variable "listener".

Así pues, sólo deberías tener en el escenario el MC "fondofoto" dibujado a mano, los respectivos botones (que deben tener su propia programación, claro) y los campos de texto dinámico que necesites. Mira en los posts que elchichinet me recomendó al principio de este hilo.
Además, te recuerdo que "mi" galería está hecha a partir de la que Ereb preparó en su tutorial: en la galería hay más código que no puse en este hilo porque ya estaba puesto en aquel tutorial de Ereb.

Por otra parte, me permito recomendarte echar un buen vistazo al manual de ActionScript que viene en Flash y, mejor, empieza por cualquiera de los magníficos tutoriales que Ereb, Freddie y otros han preparado para Cristalab:
http://www.cristalab.com/tutoriales/guia-definitiva-para-novatos-de-flash-c78l/
http://www.cristalab.com/tutoriales/programacion-orientada-a-objetos-en-actionscript-2-c51l/
http://www.cristalab.com/tutoriales/tutorial-de-actionscript-2.0-en-flash-c21l/
http://www.cristalab.com/tutoriales/tutorial-de-uso-de-listeners-en-actionscript-2.0-c29l/

Ánimo que ya te queda menos.

Ciruelo escribió:

Hola, muchas gracias, me vasto con la explicacion, ya tengo centrada las imagenes como queria (y como deberian salir ), el problema era el mc "fondofoto" que tanto me hacia bolas, pero otro problemilla q no me percate es q estuve exportando el SWF para ser leido por Flashplayer 6, parece q stuve tocando y movi algo; claro, lo corregi y "oh sopresa" todo se arreglo.

De nuevo te digo: muchas gracias por la explicacion.

ahora me interesaria agregarle precargas para las imagenes, revise x ahi en el foro, solo tengo como ejemplo la precarga d Freddy, q lleva una nota: "No sirve para cargar en galerias"; si sabes algun link podrias pasarmelo?
Tbm kisiera q cada imagen linkee una URL...
salu2