Ayuda con galería de imágenes y clase en botón AS3
Hola estoy haciendo una galeria de imagenes con categorias y me estaba encontrando con algunos problemas que me gustaria compartir haber si me podeis ayudar:
En principio lo que estaba haciendo es sacar tantos botones como categorias hay ayudandome de la clase boton al cual le paso el nombre de la categoria.
Luego coloco los thumbnails de la categoria que se suponga este seleccionada en ese momento y creo la funcion que muestra la imagen al hacer click en algun thumbnail.
EL problema aparece a la hora de saber que categoria a sido clickeada...nose como hacer desde la funcion click de la clase para cambiar el valor de la variable categoria situada en el codigo principal... Os pego el codigo haber si podeis ayudarme:
CODIGO PRINCIPAL
var i:Number;
var tb:MovieClip;
var vis:MovieClip;
var dirX:Number = 0;
var dirY:Number = 0;
var ldr:Loader;
var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
var categoria:Number =1;
var foto; Loader;
var xButton:Number = 0;
xmlLoader.load(new URLRequest("imagenes.xml"));
xmlLoader.addEventListener(Event.COMPLETE, CargaDirecta);
function CargaDirecta(e:Event):void
{
xmlData = new XML(e.target.data);
//saco tanto botones como categorias, enviandole el nombre de la categorita
for (i = 1; i <= xmlData.categoria.length(); i++)
{
// Instancializamos la clase ButtonStd
var myButton:ButtonStd = new ButtonStd (xmlData.categoria.(@id==i).@name);
// Ubicamos el nuevo ButtonStd
// ( fijaros que no es _x y _y )
myButton.x = 10+xButton;
myButton.y = 10;
xButton=+100;
// Añadimos el ButtonStd al escenario
// esto equivale a un attachMovie
addChild(myButton);
}
//recorro en el XML la categoria seleccionada para mostrar sus thumbnails
for (i = 1; i <= xmlData.categoria.(@id==categoria).foto.length(); i++)
{
tb = new MovieClip();
tb.x = 75 * dirX + 5;
tb.y = 75 * dirY + 50;
addChild(tb);
dirX++;
if (dirX == 2)
{
dirX = 0;
dirY++;
}
CargarThumbs();
}
}
function CargarThumbs():void
{
//cargo la imagen en el movie clip y lo muestro
ldr = new Loader();
ldr.load(new URLRequest(xmlData.categoria.(@id==categoria).foto.(@id==i).@thumb));
tb.addChild(ldr);
Click(i);
}
function Click(n:Number):void
{
function alClick(e:MouseEvent):void
{
//Muestro la imagen en grande si pinchas en el thumbnail
vis = new MovieClip();
foto = new Loader();
foto.load(new URLRequest(xmlData.categoria.(@id==categoria).foto.(@id==n).@image));
vis.x = 475 - (xmlData.categoria.(@id==categoria).foto.(@id==n).@tam)/2;
vis.y = 50;
addChild(vis);
vis.addChild(foto);
}
ldr.addEventListener(MouseEvent.CLICK, alClick);
}
CLASE BOTON:
package {
// Contiene la libreria para objectos MovieClip
import flash.display.MovieClip;
// Contiene la libreria para manipulacion de eventos del raton
import flash.events.MouseEvent;
// Contiene la libreria para manipulacion de textos
import flash.text.TextField;
// Definimos el nombre de la clase
// Debe empezar por mayusculas y tener
// el mismo nombre que el archivo que la contiene
public class ButtonStd extends MovieClip {
// Método constructor que inicializa la clase
public function ButtonStd(_label:String) {
this._label = _label;
this.setEvents();
}
// Metodo 'setter' para modificar la etiqueta del boton
public function set _label(_label:String):void {
// Usamos la función getChildByName cuando queremos buscar un
// elemento creado directamente en este caso y con nombre
// label_txt. Por otra parte decimos que dicho elemento es
// de tipo TextField mediante as [tipo]
this.label_txt = getChildByName("label_txt") as TextField;
label_txt.text = _label;
}
// Metodo para configurar los eventos asociados al boton
private function setEvents():void {
// asociamos un metodo al evento de pulsar el raton
addEventListener(MouseEvent.CLICK, click_handler);
// asociamos un metodo al evento de pasar por encima con el raton
addEventListener(MouseEvent.MOUSE_OVER, over_handler);
// asociamos un metodo al evento salir del boton con el raton
addEventListener(MouseEvent.MOUSE_OUT, out_handler);
}
private function click_handler(event:MouseEvent):void {
//trace('click',this.label_txt.text, this.label_txt.name);
}
private function over_handler(event:MouseEvent):void {
this.label_txt.textColor = 0x000000;
}
private function out_handler(event:MouseEvent):void {
this.label_txt.textColor = 0x999999;
}
}
}
goliatone
Si te digo la verdad, el código que tienes ahí es un poco confuso...me cuesta un poco seguir la lógica que le has puesto.
En cualquier caso, como solución rápida, te diría que puedes hacer lo siguiente.
Dale a tus botones un nombre relacionado con la categoría que representa.
Crea un diccionario y guarda la relación de nombre botón => id categoría.
Cuando presionas un botón, en la función que utilizas como handler, utiliza event.currentTarget.name para obtener el nombre del botón(nombre de la categoría )
Utiliza ese nombre para obtener el id de la categoría sacándolo del diccionario.
En cualquier caso, veo que necesitas saber dos referencias, la categoría y la foto...
//////////////////////////////////////////////////////
var i:Number;
var tb:MovieClip;
var vis:MovieClip;
var dirX:Number = 0;
var dirY:Number = 0;
var ldr:Loader;
var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
var categoria:Number =1;
var foto; Loader;
var xButton:Number = 0;
var _infoPorNombre:Dictionary = new Dictionary // AQUI GUARDAREMOS LA INFORMACION PARA PODER CARGAR DESPUES LAS FOTOS.
xmlLoader.load(new URLRequest("imagenes.xml"));
xmlLoader.addEventListener(Event.COMPLETE, CargaDirecta);
function CargaDirecta(e:Event):void
{
xmlData = new XML(e.target.data);
//saco tanto botones como categorias, enviandole el nombre de la categorita
for (i = 1; i <= xmlData.categoria.length(); i++)
{
// Instancializamos la clase ButtonStd
var myButton:ButtonStd = new ButtonStd (xmlData.categoria.(@id==i).@name);
// Ubicamos el nuevo ButtonStd
// ( fijaros que no es _x y _y )
myButton.x = 10+xButton;
myButton.y = 10;
xButton=+100;
// Añadimos el ButtonStd al escenario
// esto equivale a un attachMovie
addChild(myButton);
}
//recorro en el XML la categoria seleccionada para mostrar sus thumbnails
for (i = 1; i <= xmlData.categoria.(@id==categoria).foto.length(); i++)
{
tb = new MovieClip();
tb.x = 75 * dirX + 5;
tb.y = 75 * dirY + 50;
addChild(tb);
dirX++;
if (dirX == 2)
{
dirX = 0;
dirY++;
}
CargarThumbs();
}
}
function CargarThumbs():void
{
//cargo la imagen en el movie clip y lo muestro
ldr = new Loader();
ldr.load(new URLRequest(xmlData.categoria.(@id==categoria).foto.(@id==i).@thumb));
tb.addChild(ldr);
ldr.name = categoria + "_" + i;// LE DOY UN NOMBRE AL LOADER
_infoPorNombre[ ldr.name ] = { cat:categoria, id:i }; // GUARDO LA INFORMACION RELEVANTE PARA ESTE LOADER: CATEGORIA, ID FOTO
ldr.addEventListener(MouseEvent.CLICK, alClick);
}
function alClick(e:MouseEvent):void{
//Muestro la imagen en grande si pinchas en el thumbnail
var loaderName:String = e.currentTarget.name; //OBTENER EL NOMBRE DEL LOADER.
var loaderInfo:Object = _infoPorNombre[ loaderName ]; // CON EL NOMBRE, TENEMOS LA INFORMACION: CATEGORIA, ID FOTO.
vis = new MovieClip();
foto = new Loader();
foto.load(new URLRequest(xmlData.categoria.(@id==loaderInfo.cat).foto.(@id==loaderInfo.id).@image));
vis.x = 475 - (xmlData.categoria.(@id==loaderInfo.cat).foto.(@id==loaderInfo.id).@tam)/2;
vis.y = 50;
addChild(vis);
vis.addChild(foto);
}
/////////////////////////////////////////////////////////////////////
Por supuesto, no lo he probado, pero te sirve para darte una idea.
saludos,
goliatone