Preloader com botões

[Claudio Gomes]

Pessoal, estou com um problema e vou tentar detalhar.

Estou desenvolvendo um portifolio pra mim em Flash CS4 e AS2 e está quase tudo funcionando prefeitamente, porém, gostaria de colocar um preloader.

Criei uns botões com thumbs das imagens depois criei um mc com todos os botões e setas para esquerda e direita, joguei no palco e está funcionando show. Para eu vizualizar as imagens (externas) referente aos thumbs criei um mc vazio e também está funcionando perfeitamente.

Agora o que eu queria é colocar um preloader em cada botão pra quando a pessoa clicar numa determinada imagem, ela ver o preloaderzinho funcionando e não ficar aquela sensação de que nada aconteceu quando a pessoa clicou no botão.

Obrigado,

Claudio

[Pooh]

Olá amigo!

Detalhe mais por favor.

Quando você clika na imagem(preview) ela carrega a imagem original, é isso ?

[Claudio Gomes]

Pooh, obrigado por responder,

isso mesmo, ao clicar nos botões thumbs, ele carregaria o preloader e depois iria para a imagem referente a cada botão entendeu?

Estou colocando 2 exemplos. Melhor visualizado no Safari ou Chrome. Se for visualizar no Firefox, tem que clicar 2 vezes nas imagens. Acho que é por causa do 000webhost.com hehehe.

No exemplo.swf

http://claudiojc.com/exemplo

está funcionando numa boa sem o preloader.

No exemplo2.swf

http://claudiojc.com/exemplo2/

eu apenas troquei o código que estava assim:

on (release) {_root.createEmptyMovieClip(_root.telavazia, i);
loadMovie("imagens/foto1.jpg", _root.telavazia);
_root.telavazia._x = 330;
_root.telavazia._y = 95;
_root.telavazia._xscale = 50;
_root.telavazia._yscale = 50;
}

por este código, mudando a imagem pelo preloader pra ver se o preloader funciona:

on (release) {_root.createEmptyMovieClip(_root.telavazia, i);
loadMovie("preloader.swf", _root.telavazia);
_root.telavazia._x = 190;
_root.telavazia._y = 0;
_root.telavazia._xscale = 100;
_root.telavazia._yscale = 100;
}

Neste caso o preloader funciona até uma certa parte e para no 100%. Na conclusão, o preloader teria que ir até o 100%, desaparecer num fade out e depois que desse o fade out iria direto pra respectiva imagem do boato, no caso foto1.jpg como no exemplo.swf Este é o AS do meu preloader

var pc = 0;
this.onEnterFrame = function() {
pc = Math.floor((_root.getBytesLoaded()/_root.getBytesTotal())*100);
this.pc_txt.text = pc+"%";
this.bar._xscale = pc;
if (pc == 100 && !isNAN(pc)) {
delete this.onEnterFrame;
_root.play();
}
};

Caso queira aqui está o exemplo.fla, exemplo2.fla, preloader.fla e o preloader.swf para análise.

Obrigado

[Pooh]

vou analisar seus arquivos, não sei lhe dizer se esta é a melhor forma de se fazer um preloader.

O AS2 pode usar conceitos de listeners para monitorar isso.

Em resumo:

Você criar um Carregador

Adiciona a esse carregador um listener que vai monitorar por exemplo os bytes carregados até o presente momento.

Carrega uma imagem/arquivo pelo carregador

com esses dados obtidos você monta facilmente um retangulo que vai sendo preenchido ou uma porcentagem.

E quando o valor atingir o desejado, seja 100% ou qualquer outro valor que você quiser, você chama uma função que acaba com esse listener e mostra a foto com fade.

Para o fade, sem usar a timeline você pode usar bibliotecas de movimento, cada tem a sua que gosta, eu no as2 uso mc_tween e TweenLite.

Existem inumeros tutoriais sobre monitor carregamento de arquivos e imagens no as2.

Boa sorte ;)