Você não está conectado. Conecte-se ou registre-se

Ver o tópico anterior Ver o tópico seguinte Ir para baixo  Mensagem [Página 1 de 1]

1Foxdesigner.biz 

Foxdesigner.biz
Administrador

Dom 20 Jun 2010, 9:07 am
Fundo Aleatório



Autor : Pedro Teixeira





Introdução



Quase todos os dias, deparo-me com sites fabulosos, que têm na sua
concepção descrito, para que ao introduzir a página, ler um background
aleatório. Fazemos um refresh da página, e lá esta ele, um novo
background! Vamos então aprender como se poderá fazer este efeito, para
que possam tb incluir no vosso website.

Primeiro passo: Transformando JPG em SWF

1. Comecemos por criar um novo filme e gravá-lo como image0.
Deveremos ajustar as dimensões do filme para 300 x 200.

Fundo Aleatório Dimensoes

2. Uma vez gravado o novo filme, e ajustada a altura e largura do
filme, vamos colocar a nossa imagem no nosso filme. Se quiserem podem
optar pela imagem que vos dou, ou se pretenderem por uma vossa, escolham
uma imagem com as dimensões de 300x200. Se for necessário redimensionem
a imagem que se segue.

Fundo Aleatório Imagem1

3. Se tiverem uma imagem vossa pronta para inserir, façam-no. Se
por outro lado escolherem em usar a imagem que vos disponibilizo, vão ao
menu Edit e escolham a opção de Copy. De seguida no Flash MX, voltem ao
menu Edit e escolham Paste.

4. A
imagem vai encaixar perfeitamente no filme que dimensionamos. Vão ao
menu File e escolham a opção de Save. Gravem este projecto como Image0.
Retornem ao menu File e de seguida escolham a opção de Publish
(Shift+F12).

5. Vamos precisar agora de criar 5 novos filmes para poder
trabalhar correctamente. Para tal vamos necessitar de mais 5 novas
imagens. Mas não se preocupem pois já as disponibilizamos para vocês não
perderem mais tempo.

Image0.swf
Image1.swf
Image2.swf
Image3.swf
Image4.swf
Image5.swf


Todas estes ficheiros devem ser colocados todos no mesmo directório.
Cliquem sobre os ficheiros e escolham a opção de Save Target As...,
optando pelo caminho para guardar as imagens todas no mesmo local.
Fundo Aleatório Listagem
Segundo passo: Lendo Backgrounds aleatóriamente

1. Criem um novo filme em branco, e gravem-no com o nome de
Background. Vamos dimensionar o novo filme para 300 x 200, uma vez mais.

2. Agora vamos criar um novo Movie Clip e colocá-lo na nossa
stage. A maneira mais fácil de o fazer, é criar um círculo em branco e
posteriormente carregar em F8 para o converter para Movie Clip.

Fundo Aleatório Conversao

3. Deveremos então clicar com o botão direito do rato sobre o
circulo feito, e escolher a opção de Edit In Place. Com o circulo
seleccionado vamos apagar o círculo feito. Basta premir a tecla de
Delete. Cliquem onde diz Scene 1 ou na seta azul para volta para a Scene
1.

Fundo Aleatório Scene-1

4. Agora que terminamos de eliminar o circulo, deveremos ter na
nossa frente, a seguinte imagem:

Fundo Aleatório Pequeno-Circulo

Vamos dar seguimentos à nossa criação.

5. Seleccionem o circulo que vos aparece no ecrã. Vamos de
seguida ao painel de properties e definimos nos quatro campos que lá
existem, todas com o valor de zero.

Fundo Aleatório Properties

6. Após terem definido os campos com os valores de zero, passamos
a ter de definir um nome para o Movie Clip. Assim sendo deveremos dar o
nome de location ao nosso Movie Clip.

Fundo Aleatório Location

7. Olhem para a vossa timeline, e cliquem com o botão direito do
rato sobre uma keyframe em branco. Escolham a opção de Actions.
Deveremos então incluir este código nas Actions:
choice =
Math.round(Math.random()*5);
switch (choice) {
case 0 :
location.loadMovie("image0.swf");
break;
case 1 :
location.loadMovie("image1.swf");
break;
case 2 :
location.loadMovie("image2.swf");
break;
case 3 :
location.loadMovie("image3.swf");
break;
case 4 :
location.loadMovie("image4.swf");
break;
case 5 :
location.loadMovie("image5.swf");
break;
}


8. Guardem o vosso projecto e testem-no num browser. Para isso
devem ir ao menu File e depois escolher a opção de Publish (Ctrl+F12).

9. Se por acaso estiverem interessados em apanhar Backgrounds
já feitos na Internet, podem incluir no código o link directo para ir
buscar esses Backgrounds. Somente têm de fazer a seguinte alteração no
código:

location.loadMovie("http://www.flashwebtraining.com/image1.swf");

(Atenção que é somente um
exemplo, esse endereço não existe
)





Download dos Arquivos



[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]







Download

2xXx ™ 

avatar
Membro

Seg 05 Jul 2010, 8:28 pm
Tinha esse no pc xD

Vlw mano tayson

3AngeL 

avatar
Membro

Qui 26 Ago 2010, 7:40 pm
Fundo Aleatório 341528

4victortmf 

victortmf
Bronze Member

Qui 26 Ago 2010, 8:17 pm
obg por compartilhar =D

5-:-Nick-:- 

avatar
Veterano

Sáb 26 Fev 2011, 6:31 pm
- Tutorial muiito bem expliicado!
Tanks' ;D

6Hokage. 

Hokage.
Bronze Member

Dom 03 Abr 2011, 4:17 pm
Thank´s por compartilhar

7Conteúdo patrocinado 



Ver o tópico anterior Ver o tópico seguinte Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos

Compartilhe este Tópico!

Url direta
BBcode
HTML
Feito com    e muito    pela equipe Fox Design