Preloader facil, mas muito útil

[Vinicius R3 0]

Carregamento a partir da Cena 1 – Animação é feita na mesma cena onde está o preloader.

 

Em um novo documento, crie mais uma camada, na 1º camada iremos colocar um “Texto Dinâmico” com a ‘Ferramenta Texto’, para isso vá a guia de

ferramentas ou simplesmente aperte a letra ‘T’, vá até a guia Propriedades na parte inferior do programa, e na 1º caixa de opções que contem os itens

'Texto Estático, Texto Dinâmico, Texto de Entrada’ coloque o já referido Texto Dinâmico, feito isso insira o campo do Texto dinâmico mantendo o botão esquerdo

do mouse pressionado e arraste até formar um quadrado, feito isso volte a guia de ‘Propriedade’ e no campo abaixo onde esta marcado em cinza claro como

‘nome da instancia’ nomeia (instancia) como ‘porcentagem’ sem as aspas. Nesse campo que acabamos de criar ira aparecer à porcentagem de carregamento da

sua animação, não se esquecendo de escolher a fonte e o tamanho que os números de porcentagem irão aparecer.

Logo abaixo do texto dinâmico, na mesma camada desenhe um retângulo com a ‘Ferramenta Retângulo’ ou simplesmente aperte a tecla ‘R’, ele deve ter mais ou

menos as seguintes dimensões L=200 e H=2, após criar o retângulo de qualquer tamanho, você pode inserir esses parâmetros selecionando o retângulo e indo

até a guia ‘Propriedades’, que os campos L e H estarão do lado esquerdo inferior. Com o objeto (retângulo) selecionado, converta-o para um Símbolo de Clipe

de Filme (MovieClipe ou MC como muitos costumam chamar), para fazê-lo siga a seguinte seqüência no menu principal INSERIR>CONVERTER EM

SÍMBOLO... ou simplesmente aperte o F8, na guia que se abrirá marque a opção Clipe de Filme (MovieClip) e na opção de registro onde consta vário

quadradinho que por padrão vem marcado o quadradinho do centro esquerdo, mas se não tiver marcado marque-o, após isso, de a ele o nome (instancia) de

‘barra’ , sem as aspas e aperte ‘OK’ . Retornando a guia Propriedade na parte inferior do programa, especificamente na parte inferior esquerda, no campo

‘Nome da Instancia’ que esta escrito em cinza claro nomeie (instancie) como ‘barra’ sem aspas, com isso o Action que iremos inserir na segunda camada irá

reconhecê-lo e mostrá-lo por partes conforme o ‘carregamento’ do filme progredir.

 

Agora vamos para a 2º camada.

De um clique no 1º frame e vá até o a guia Ações, na parte inferior do programa juntamente com a guia Propriedade, e insira o ActionScript abaixo no campo

em branco do lado inferior direito:

 

 

 

//o Action começa aqui, selecionando a partir da linha de baixo até o ponto onde se diz que terminouthis.stop();this.barra._xscale = 0;this.carregador = function() {var total = this.getBytesTotal();var carregado = this.getBytesLoaded();var pct = Math.floor(carregado*100/total);this.porcentagem.text = pct + "%";this.barra._xscale = pct;if(total > 4 && pct == 100) {this.gotoAndPlay(2);clearInterval(this.interval);};};this.interval = setInterval(this, "carregador", 200);//e termina aqui, nao selecione esse trecho

 

Depois disso é só fazer sua animação normalmente a partir do segundo Keyframe e do segundo frame.Você pode reparar que na linha do ActionScript

'this.gotoAndStop(2);’ consta o número 2, isso quer dizer que após o filme estar totalmente carregado ele iniciará a animação a partir do 2º Keyframe.

Para testar coloque uma animação ‘pesada’ (recomendo que o tamanho seja no mínimo de 120 Kbs) a partir do segundo Keyframe (se você quiser pode abrir

uma terceira camada e colocar animação nela) e de Crtl+Enter ou siga a seguinte seqüência CONTROLAR>TESTAR FILME, de inicio ira aparecer sua

animação, para você conseguir visualizar o preloader aperte novamente Crtl+Enter, no entanto se você colocou uma animação muito leve a partir do segundo

Keyframe, o carregamento será muito rápido e você não conseguirá visualizar o preloader.

[Vinicius R3 0]

Bom niguem curtiu o tuto???Bom peleo menos fiz minha parte postei o tuto, agora façam a parte de vcs, comentem

[NewUser 0]

Maravilha, tudo que um script precisar ser, simples e funcional.Parabéns

[klaulins 0]

Bom... eu curti o Tutorial sim, mas tô com um problema, não só com este preloader mas com qualquer um que coloco na minha animaçao! Els só aparecem quando já esta mais de 90%. Já fiz una 5 Preloders diferentes e nada de funcionar.O arquivo tem +ou- 200kb!Alguma ideia do que seja?Desde já, muito obrigado!Claudio Lins

[Antoniosp 2]

Claudio, você por acaso está usando Linkage no seu swf? Se tiver é bem provável que o problema seja esse, é por causa do "export to first frame".Flw

[klaulins 0]

Claudio, você por acaso está usando Linkage no seu swf? Se tiver é bem provável que o problema seja esse, é por causa do "export to first frame".Flw

Valeu.... é isso mesmo!Resolveu meu problema.... obrigado!Claudio Lins

[Tiag0 0]

Cara se eu fizer esse preloader num filme novo ele sai certinho

 

porem tentei coloca-lo no em um filme antigo que estava com um preloader que nao consigui fazer funcionar, e o seu preloader tambem nao funcionou nele!!

 

no primeiro preloader o erro era:

 

**Error** Scene=Scene 1, layer=preloader, frame=1:Line 11: Syntax error.

pct = pct add "%";

 

e o codigo

onClipEvent(load) {total = _parent.getBytesTotal();_parent.stop();barra._xscale = 0;}onClipEvent(enterFrame) {loaded = _parent.getBytesLoaded();p = Math.floor((loaded/total)*100)barra._xscale = pct;if (p == 100) _parent.nextFrame();p = p add "%";}

mas ele dava essa mensagem que citei ai em cima

 

agora o seu eu estou estranhando pois ele carrega muito rápido e quando aperto ctrl enter para testar de novo ele fica parado na barra! Modifiquei o a Action do frame 2 para gotoAndPlay(3); e o preloader nao carregou mais!

O que pode ser???

Outra duvida minha que nao tem muito a ver com o preloader, Tem como colocar musica no filme sem que ele pese muito na hora de exportar para swf???

 

Vlwww

[Kranyo 0]

Bom niguem curtiu o tuto???

 

Bom peleo menos fiz minha parte postei o tuto, agora façam a parte de vcs, comentem

CURTI o tuto legal msmo..sempre quis fazer isso mas sempre tive preguiça rsrsrs... http://forum.imasters.com.br/public/style_emoticons/default/blush.gif

bom eu gostaria de ver msmo uma transição de paginas como essa, sempre ke se clica em um botão ele repeti a animação do site e vai pro seu link respectivo...isso gostaria de entender. se alguem tiver uma video aula sobre.

http://www.achow.com.br/rangelwebstudio

 

http://www.rangelwebstudio.xpg.com.br

 

links diferentes porem o msmo site...

 

se alguem puder me ajudar a entender isso....Obrigado :rolleyes:

saúde.

[Jair Humberto 2]

eu havia desenvolvido um preloader igualzinho com uma pequeno toque final do antonioSP. E inclusive postei aqui nesta área.

interessante como esse seu ficou igualzinho ao meu. <_< Até o código AS ficou quase idêntico. <_<

 

o link ta abaixo

 

http://forum.imasters.com.br/index.php?showtopic=232793