rucka55

Olá pessoal, Esse tutorial abaixo foi feito pelo Lucas Ferreira em outro fórum e se trata de uma galeria de fotos feita através de uma classe criada. Muito bom!! Funciona que é uma beleza! O problema é o seguinte: Como faz para chamar essa galeria externamente em outro arquivo? Eu tentei e as fotos da galeria não aparecem :blink: Alguém sabe como solucionar isso? ...Aí esta o link e o tutorial ----------------------------------- http://www.imasters.com.br/artigo/3495/act...os_facillitada/ ........................................ Esta galeria tem como princípio básico, dados vindos de um xml, que contem as informações sobre as imagens, uma thumb e a imagem em tamanho original. Arquivo XML: Copie o código abaixo, e personalize como quiser, sempre fazendo referencia a imagem pequena(fp) e imagem grande(fg), logo após, salve o arquivo com o nome de fotos.xml, no diretório em que vamos trabalhar. <?xml version="1.0" encoding="UTF-8"?> <fotos> <foto fp="imgs/foto1p.jpg" fg="imgs/foto1g.jpg"/> <foto fp="imgs/foto2p.jpg" fg="imgs/foto2g.jpg"/> <foto fp="imgs/foto3p.jpg" fg="imgs/foto3g.jpg"/> <foto fp="imgs/foto1p.jpg" fg="imgs/foto1g.jpg"/> <foto fp="imgs/foto2p.jpg" fg="imgs/foto2g.jpg"/> <foto fp="imgs/foto3p.jpg" fg="imgs/foto3g.jpg"/> <foto fp="imgs/foto1p.jpg" fg="imgs/foto1g.jpg"/> <foto fp="imgs/foto2p.jpg" fg="imgs/foto2g.jpg"/> <foto fp="imgs/foto3p.jpg" fg="imgs/foto3g.jpg"/> <foto fp="imgs/foto1p.jpg" fg="imgs/foto1g.jpg"/> <foto fp="imgs/foto2p.jpg" fg="imgs/foto2g.jpg"/> <foto fp="imgs/foto3p.jpg" fg="imgs/foto3g.jpg"/> </fotos> Iniciando no Flash: Começaremos criando um arquivo no flash com o nome de galeria.fla com quatro camadas: actions, carregando..., layout, fundo, e a seguinte configuração de palco: Logo após vá na camada layout, e desenhe um quadrado responsável pela área de carregamento da imagem grande, e o instancie como img_grande: Depois crie um movie vazio posicionando aonde deverá ficar as miniaturas das imagens ainda na camada layout, e o instancie como conteinerInicial: Crie mais um movie vazio, e posicione aonde deverá ficar os botões de páginação, e o instancie de paginacao: Crie um mc, que deverá ficar somente na bilioteca, este com 3 camadas e 3 frames, a primeira vazia, com uma action de stop(); no primeiro frame. A segunda camada deve conter uma caixa de texto dinamic, não selecionável com o instance de pg. Na terceira camada, deverá conter os fundos do botão, no primeiro frame o botão normal, no segundo ao passar por cima, e no terceiro ao ser pressionado. Por fim nosso mc para o botão de páginação ficará assim: Logo após clique com o botão direito neste mc na biblioteca, vá em Linkage, e defina as seguintes configurações: Vamos aos Códigos Tudo no primeiro frame, siga os passos. 1º Função de carregamento dos dados e inicialização: //variaveis da sequencia... var fotos:Array = new Array; //função de inicio do projeto... function init():Void { //carregando xml... var loadDados:XML = new XML(); loadDados.ignoreWhite = true; loadDados.onLoad = function(sucess) { if (sucess) { //primeiro nó: fotos; var f = this.firstChild.childNodes; //listando conteúdo do nó e inserindo no array de fotos for (var i = 0; i<f.length; i++) { var novaimg:Object = new Object(); //criando o objeto de cada foto novaimg.img_p = f.attributes.fp; novaimg.img_g = f.attributes.fg; fotos.push(novaimg); //inserindo objeto no array } //chamando função q faz a galeria... criaGaleria(); } }; //load no arquivo .xml loadDados.load("fotos.xml"); } 2º Agora vamos a função responsável pela criação da galeria (criaGaleria): //função que cria a galeria function criaGaleria():Void { car._visible = 0; //preloader de imagens grande, usando MovieClipLoader... //fica livre para usar como quiser... var mvlIMG:MovieClipLoader = new MovieClipLoader(); var mvlOBJ:Object = new Object(); mvlOBJ.onLoadStart = function(){ car._visible = 1; } mvlOBJ.onLoadProgress = function(obj, bl, bt){ var p = (Math.round(bl/bt) * 100) //porcentagem carregada da imagem car.p.text = "Carregando... " + p + "%"; } mvlOBJ.onLoadComplete = function(){ car._visible = 0; } mvlIMG.addListener(mvlOBJ); // //criando sistema de galeria(quantidade de fotos, fotos por pagina, colunas, altura miniatura, // largura, espacamento x, e y); _global.galeria1 = new Distribute(fotos.length, 8, 2, 80, 60, 4, 3); // var objGal1:Object = new Object(); objGal1.onDistStart = function() { //ação de inicio da distribuição das fotos... //verifica se o mc já está no palco, caso esteja, remove para nova página... if(_root.miniaturas){ //removendo miniaturas anteriores na troca de pagina... _root.miniaturas.removeMovieClip(); } //duplicando o mc conteiner q vai conter as miniaturas, para um novo que poder ser removido... _root.conteinerInicial.duplicateMovieClip("miniaturas", 1); //definindo onde o mcConteiner deve aparecer... miniaturas._x = conteinerInicial._x; // _x miniaturas._y = conteinerInicial._y; // _y //escondendo... miniaturas._visible = 0; }; // objGal1.onDistUpdate = function(info:Object) { //puxando da bliblioteca o mc com linkage miniatura, e já posicionando de arquivo com o _x e _y //passados pelo var info... _root.miniaturas.attachMovie("miniatura", "fp_"+info.iObj, galeria1.nDepth(_root.miniaturas), {_x: info.x, _y: info.y}); //informando ou passando, para miniatura, qual é sua foto grande... _root.miniaturas["fp_"+info.iObj].img_g = fotos[info.index].img_g; //criando o movie clip alvo para receber a img pequena, dentro do mc Conteiner... _root.miniaturas["fp_"+info.iObj].createEmptyMovieClip("img_p", 1); //carregando thumb via loadMovie... _root.miniaturas["fp_"+info.iObj].img_p.loadMovie(fotos[info.index].img_p); //definindo ação de clique na miniatura, para ampliar... _root.miniaturas["fp_"+info.iObj].onRelease = function(){ //usando o obj mvlIMG, para carregar a imagem grande... mvlIMG.loadClip(this.img_g, img_grande); } }; objGal1.onDistEnd = function(info:Object) { //ação de distribuição completa, exibindo mc Conteiner, chamado de miniaturas... miniaturas._visible = 1; }; //definindo ao objeto galeria1, os objetos e eventos que deve utilizar... galeria1.addEventListener("onDistStart", objGal1); galeria1.addEventListener("onDistUpdate", objGal1); galeria1.addEventListener("onDistEnd", objGal1); // //montando paginação, pegase o nº de paginas e faz o paginador... //função responsável pelo click dos bts da paginação... function setPg(obj){ //restaurando todos bts, para o primeiro frame... for (i=0; i<galeria1.nPages; i++) { var mcPgAtual = this._parent["mcPg_" add i]; if(mcPgAtual != this) mcPgAtual.gotoAndStop(1); //todos voltam menos o atual... } //definindo o frame q deve mostrar... this.lastFrame = 3; //mostrando página solicitada... var iAtual:Number = int(this.pg.text); galeria1.showPage(iAtual); } for (i=0; i<galeria1.nPages; i++) { //ataxando ao mc vazio, paginacao, os bts de página... var mcPgAtual = paginacao.attachMovie("mcPg", "mcPg_" add i, i); mcPgAtual._x = (i*(mcPgAtual._width+3)); //posicionando bt no mc... mcPgAtual.pg.text = (i+1); //setando no bt, a pg dele... //definindo eventos e ações paga o bt da página... mcPgAtual.onRollOver = function(){ //pega o frame atual e armazena, caso o bt seja o bt de página clicada... this.lastFrame = this._currentframe; //ao passar por cima acende this.gotoAndStop(2); } mcPgAtual.onRollOut = function(){ this.gotoAndStop(this.lastFrame); } mcPgAtual.onRelease = setPg; } // //mostrando pagina 1 e setando o botão de pg 1... paginacao["mcPg_0"].gotoAndStop(3); galeria1.showPage(1); } 3º Completando, o inicio do projeto: // //iniciando por fim, a galeria... init(); Agora so publicar e testar nossa galeria Clique aqui para baixar os arquivos utilizados neste artigo. Até a próxima e abracetas!