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.
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.
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.
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.
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.
4. Agora que terminamos de eliminar o circulo, deveremos ter na
nossa frente, a seguinte imagem:
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.
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.
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
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.
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.
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.
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.
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.
4. Agora que terminamos de eliminar o circulo, deveremos ter na
nossa frente, a seguinte imagem:
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.
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.
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