Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Thiago de Oliveira Cruz

Tutorial Slideshow Dinâmico

Por , em Flash, ActionScript e tecnologias Adobe

Recommended Posts

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Esse tutorial foi postado em meu blog:

berseck.wordpress.com

 

Bom galera, eu vo aqui mostrar como que se faz um slideshow dinâmico.

 

Aqui como deve ficar no final :)

Imagem Postada

 

 

Eu criei esse slideshow devido a necessidade que eu tive...

 

E então fiz ele ficar dinâmico para poder adicionar quantas imagens você quiser

 

Então vamos ao código!

 

//importo as funções necessárias
import mx.transitions.Tween;
import mx.transitions.easing.*;
import flash.display.Stage;

Stage.scaleMode = "noScale";

//Crio o loader
var mcl:MovieClipLoader = new MovieClipLoader();
//Crio os clips a serem carregados
var alvo:MovieClip = _root.createEmptyMovieClip("alvo", _root.getNextHighestDepth());
var alvo2:MovieClip = _root.createEmptyMovieClip("alvo2", _root.getNextHighestDepth());

//Pego o tamanho do palco
var StageW:Number = Stage.width;
var StageH:Number = Stage.height;

//Digo a posição inicial das fotos no palco - centralizando-as
alvo._x = StageW/2;
alvo._y = StageH/2;
alvo2._x = StageW/2;
alvo2._y = StageH/2;

//Pego os valores de altura, largura, x e y dos clips
var alvoX:Number = alvo._x;
var alvoY:Number = alvo._y;
var alvoWidth:Number = alvo._width;
var alvoHeight:Number = alvo._height;

var alvo2X:Number = alvo2._x;
var alvo2Y:Number = alvo2._y;
var alvo2Width:Number = alvo2._width;
var alvo2Height:Number = alvo2._height;

//Crio minha Array
var dados:Array = new Array;

//Crio meu contador
var atual:Number = new Number;

//Função que carrega as fotos do arquivo
var carrega:LoadVars = new LoadVars();
carrega.load('slide.html');
carrega.onLoad = function (success:Boolean){
	if(success){
		fotos = carrega.fotos;
		var dados = fotos.split(",");
		criaarray = function(){
			return(dados);
		}
		carregafilme(dados);
	}else{
		trace("Falha ao carregar os dados");
	}
};

//Função que carrega a primeira seqüencia de fotos
function carregafilme(dados){
	imagem1(dados, atual);
	timer = function(){
		loopeterno();
		clearInterval(tempo);
	}
	tempo = setInterval(timer, 3000);
};

// Função para avançar 1 foto
intervalo = function(){
	dados = criaarray();
	i = incrementa(dados);
	imagem2(dados, i);
	var anima1:Tween = new Tween(alvo, "_alpha", Linear.easeIn, 100, 0, 3, true);
	var anima2:Tween = new Tween(alvo2, "_alpha", Linear.easeIn, 0, 100, 3, true);
	anima2.onMotionFinished = function(){
		imagem1(dados, i);	
	}
};

// Função para voltar 1 foto
volta = function(){
	dados = criaarray();
	i = decrementa(dados);
	imagem1(dados, i);
	var anima1:Tween = new Tween(alvo, "_alpha", Linear.easeIn, 0, 100, 3, true);
	var anima2:Tween = new Tween(alvo2, "_alpha", Linear.easeIn, 100, 0, 3, true);
	anima2.onMotionFinished = function(){
		imagem2(dados, i);	
	}
};

// Função que carrega o primeiro clip
function imagem1(a, i){
	num = a[i];
	mcl.loadClip(a[i], alvo);
	mcl.addListener(this);
	return(num);
};

// Função que carrega o segundo clip
function imagem2(a, i){
	num = a[i];
	mcl.loadClip(a[i], alvo2);
	mcl.addListener(this);
	return(num);
};

// Função para aumentar 1 no numero de fotos
function incrementa(a){
	atual++
	if(atual > (a.length - 1)){
		atual = 0;
		return(atual);
	}
	return(atual);
};

// Função para diminuir 1 no numero de fotos
function decrementa(a){
	atual--;
	if(atual < 0){
		atual = (a.length - 1);
		trace(atual);
		return(atual);
	}
	return(atual);
};

//Chamo um loop eterno
loopeterno = function(){
	intervalo();
};

// Ao carregar
function onLoadInit(alvo) {
	redimensionar(alvo);
	alvo._x = alvoX + (alvoWidth/2) - (alvo._width/2);
	alvo._y = alvoY + (alvoHeight/2) - (alvo._height/2);
};

// Redimensiona
function redimensionar(alvo){
	alvo._xscale = 100;
	alvo._yscale = 100;
	if(alvo._width > alvo._height and alvo._width > StageW){
		alvo._xscale = ((StageW)*(100))/alvo._width;
		alvo._yscale = alvo._xscale;
	}
	else if(alvo._height > alvo._width and alvo._height > StageH){
		alvo._yscale = ((StageH)*(100))/alvo._height;
		alvo._xscale = alvo._yscale;
	} else {
		alvo._xscale = 100;
		alvo._yscale = 100;
	}
};

mcl.addListener(this);
looptimer = setInterval(loopeterno, 9000);
Código todo comentado :)

 

Espero que vocês gostem

 

Qualquer coisa é só falar

 

Para baixar clique aqui

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rodrigo Henrique    0

Rodrigo Henrique
Postado

Sou inciante, e nem deveria estar aqui. Mas esse código onde coloco? No bloco de notas no Macromedia Flash 8?

Gostaria que vocês me dessem uma "luz" sobre isso.

Estou fazendo um site aqui e gostaria de tirar minhas dúvidas.

Agradeço a atenção.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Ele pede o html que tem os dados...

 

Eu chamo aqui

var carrega:LoadVars = new LoadVars();
carrega.load('slide.html');
carrega.onLoad = function (success:Boolean){
	if(success){
		fotos = carrega.fotos;
		var dados = fotos.split(",");
		criaarray = function(){
			return(dados);
		}
		carregafilme(dados);
	}else{
		trace("Falha ao carregar os dados");
	}
};

Ali onde está slide.html é o site que chama esse swf que você colocou o código

Eu coloco o parametro:

<param name="FlashVaras" value="&fotos=suafoto.jpg,suafoto2.jpg&" />

E assim vou colocando as fotos lá

Você pode puxar também por um XML ou um dado pelo PHP....

Se só vai ter de modificar minha função onLoad para receber esse dado corretamente e converte-lo em uma Array... para que ele possa continuar as funções normais sem dar erro ;)

 

Boa sorte

 

Duvidas é só postar... mandar mp... etc

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rodrigo Henrique    0

Rodrigo Henrique
Postado

Bom, agradeço mas infelizmente não consegui, deu um erro.

Gostaria de saber se você tem uma vídeo-aulas ou vídeo-aulas para me passar sobre como criar menu, site, animações e etc em Flash. De como utilizar o Dreamweaver e tals.

Agradeço a atenção.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

bom se o seu inglês for bom ;)

www.gotoandlearn.com é um otimo site de referencia de video aula.

 

e o proprio site deles mesmo www.imasters.com.br é uma otima fonte de referencia.

 

tem também www.pontoflash.com........ tem varios foruns....... kirupa.com e assim vai

 

O negocio é o que você ta procurando então google neles...

 

:)

E o arquivo de slideshow está desponivel para o download só baixar e testar... mudar as fotos que coloquei no html para umas que você deseje.

 

na linha

<param name="flashvars" value="&fotos=aqui você coloca o nome das fotos.jpg ou png como você quiser separada por virgulas" />

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Matheus Brito    12

Matheus Brito
Postado

Muito bom, agora so uma dica quando postar um tuto poste um exemplo de como ficará, assim já da pra ter ideia do que vem pela frente.

Abs thiago

 

 

@O blog mudou o endereco foi?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Foi :P

 

Pq tava f*** xD mexe com aquele blog ruim da vida lá... alem de não ter estatisticas nem nada...

 

Para eu ter ideia do que a galera vem procurar no blog né :)

 

Já no wordpress tem tudo ;)

 

Vou colocar um exemplo

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Tenta fazer assim:

var xml:XML = new XML();
xml.ignoreWhite = true;
xml.load('slide.xml');
xml.onLoad = function (success:Boolean){
    if(success){
        var cn = xml.firstChild.childNodes;
        for(var i = 0; i < cn.length; i++){
            dados[i] = cn.childNodes;
        }
        carregafilme(dados);
    }else{
        trace("Falha ao carregar os dados");
    }
};

 

Tava aqui pensando agora...

Muito mal feito esse meu código O_O...

 

Tem como melhorar absurdos isso ae rs.

 

Depois eu refaço e posto denovo

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

adsoncs    0

adsoncs
Postado

Berseck, cara me ajuda... como eu faria pra colocar rollover com descrição das imagens nesse .html ou da uma luz em xml.

Abração e valeu cara.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Para colocar um rollOver...

 

Primeiramente você cria um ToolTip

 

ou seja um quadradinho que contenha um campo de texto dentro...

 

E ai na função de onLoadInit

você coloca alvo.onRollOver = nome da função...

 

Ou digita ali function e faz com que apareça um tooltip referente a aquele alvo

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Evandro Silva    0

Evandro Silva
Postado

Amigo, estou precisando adapatr esse seu slideshow para rodar fotos com tempos diferentes (cada foto com um tempo especifico) sem botoes, quero que mude de imagem automaticamente e que cada foto fique na tela de acordo com o tempo que for especificado pra ela no xml.

 

Depois de exibir a ultima imagem do xml ele atualize o xml pra pegar possiveis alterações na lista de imagens.

 

Isso é possível?

 

Agradeço a ajuda.

Compartilhar este post

Link para o post
Compartilhar em outros sites

filhook    0

filhook
Postado

Amigo ótimo tutorial. Consegui implementar tranquilo….só que quando joguei em um servidor online em um site como Background dinamico do site….na hora de trocar as imagens…como os fundos são um pouco grandes (em bytes) some a imagem e deppois q aparece….você tem como me ajudar a fazer um load da imagem e só trocar quando ela estiver totalmente carregada no Cache??

 

Da uma olhada ai no meu site: http://www.versatili.com.br

valeu.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Flash, ActionScript e tecnologias Adobe
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito