[Tutorial Avançado] Criação de um site completo em flash

Passos para criar um site completamente em Flash:

Os passos seguintes vão ajudar-nos na criação de
um site completamente em Flash:
1. Estrutura de um site em Flash
A estrutura de um site completamente em Flash, neste tutorial, consiste
no seguinte:

• Animação de Index
  A animação de index é nada mais do que a base onde
  as "verdadeiras" animações vão ser construidas.
  A animação de index vai conter apenas o menu de navegação
  e um movie clip vazio para carregamento (loading) de ficheiros SWF externos.
  
• Animações de Contexto
  As animações de contexto contêm o "verdadeiro"
  conteúdo a ser carregado na animação de index.
  

Como se pode compreender, um site completamente em flash é composto
por vários ficheiros swf individuais. A animação
de index é carregada primeiro. Clicando num dos links da navegação
vai fazer com que a respectiva animação de conteúdo seja
carregada para o movie clip em branco, situado na animação
de index. Se estás familiarizado com o loadMovie de certeza que
te vais lembrar que podes carregar animações num movie clip
ou num nível.
Provavelmente tudo isto poderá ser um pouco confuso. E se em vez
de aprendermos algo abstracto, começassemos a meter a mão
na massa? Foi criado um exemplo onde faltam muitas coisas, para que sejam
adicionadas por ti.
Vamos então começar a criar o site a que nos referimos
à pouco:

Começamos por fazer o download
do ficheiro fonte, que contém tudo o que é necessário
para começar.
Depois de teres feito o download, abre o ficheiro chamado inicio.fla.
Surgirá a estrutura básica do site, onde serão
adicionados os botões, links e o código necessário
(tudo em instruções contidas neste tutorial).
De que serve um site sem navegação? Vamos adicionar um
menu de navegação. Já existe uma base do menu de
navegação desprovida de qualquer código. Escolhe
a layer "navigation". Pressiona a tecla F11
ou vai até Window | Library.
Arrasta o simbolo "nav_background" da Library
e larga-o no stage.
Certifica-te que o objecto está perfeitamente alinhado no topo-esquerdo.
Para isso, basta seleccionar no painel Properties em baixo, e escrever
0 (zero) em ambos os campos X e Y.
Agora precisamos de criar um lugar onde os SWFs externos vão
ser carregados. Lembra-te que para usares o loadMovie, precisas de um
alvo para onde carregar o movie clip pretendido. Vai até Insert
| New Symbol. Dá um nome ao clip, escolhe Movie
Clip, e clica em OK. Verás então o clip aberto
na área de trabalho. Simplesmente clica onde diz Scene
1, para saires do mesmo (Scene 1 situa-se mesmo por baixo do
nome das layers).
Estamos de volta à timeline principal.Criamos o movie clip mas
não o adicionamos em nenhum local da nossa animação.
Clica na layer "action". Pressiona a tecla
F11 ou vai até Window | Library.
A caixa Library aparece e selecionamos o movie clip recém criado,
arrastando-o para a timeline principal. Mais uma vez, as coordenadas
para X e Y são 0(zero) e 0(zero), tal e qual como na criação
do menu de navegação. Deverá de ser visível
um pequeno circulo vazio no topo-esquerdo da timeline.
Seleciona o movie clip e dá-lhe o nome de instância (instance
name) "contents". Se não lhe for dado
este nome, o movie simplesmente não vai funcionar.
Agora, que temos o nosso movie clip no local correcto, clicamos na
layer "action" e arrastamo-la para baixo
da layer "navigation".

Agora já temos o interface da animação completo.
Mas ainda temos de adicionar as acções, e mais tarde aprender
as bases da criação do teu próprio site em Flash.

2. Adicionando actions Quase todas as animações de Flash usam actions. Como tal, é necessário um conhecimento mínimo de programação em Actionscript para tirar o máximo partido do Flash. As seguintes secções de texto e código ajudar-te-ão a conseguir o que pretendes do Flash. Vamos adicionar o código à nossa animação de Flash e mais tarde o mesmo será explicado. Certifica-te que tens o movie aberto: Clica com o botão direito do rato no menu e escolhe Edit in Place. Estamos agora a editar o movie clip que contém os botões. Clica com o botão direito do rato no botão "locais" e seleciona Actions. Copia e cola o seguinte código na caixa de diálogo Actions: on (release) { _root.contents.loadMovie("locations.swf"); } Faz o mesmo para o botão "musica", mas com seguinte código: on (release) { _root.contents.loadMovie("music.swf"); } O mesmo para o botão "membros", com o seguinte código: on (release) { _root.contents.loadMovie("membership.swf"); } E agora por último, o mesmo para o botão "home", com o seguinte código: on (release) { _root.contents.loadMovie("main_content.swf"); } Acabamos de adicionar o código a todos os botões. Salva a animação e faz um preview no browser, indo a File | Publish Preview | HTML. Agora, clica nos botõe. Note-se que as páginas individuais carregam na janela principal. Depois de ter acabado de explorar a animação, clique no botão de Refresh para visualizar a página de entrada de novo. Notou-se alguma coisa de extranho? Para o caso de ter passado despercebido, o problema é o seguinte: Quando fazemos Refresh, o conteudo mostrado deveria de ser o mesmo de quando se clica no botão "home", mas não é. Isto acontece porque quando o movie começa, nenhum SWF externo é carregado. Para resover este pequeno problema fazemos o seguinte: Clicamos em Scene 1. Presumindo que ainda se está a editar os botões, no movie clip do menu. Se não for este o caso, ignora este passo. Clica com o botão direito do rato na keyframe da layer "action" e seleciona Actions. Copia e cola o seguinte código: _root.contents.loadMovie("main_content.swf"); Salva o ficheiro e faz o preview da animação no browser indo a File | Publish Preview | HTML. Repara como o conteudo principal é imediatamente carregado. Agora a explicação do funcionamento do código. 3. O código: explicação Para carregar os movie clips, básicamente foram feitas duas coisas: Quando o utilizador clica num botão, é carregado um ficheiro a partir de uma outra localização. O ficheiro tem de ser carregado para uma localização específica. É nesta altura que dá jeito saber um pouco de Actionscript. Tendo lido e usado a acção loadMovie, concerteza percebeste que esta função é exactamente aquilo que necessitas. O loadMovie, no Flash MX, tem a seguinte estrutura básica: movieClipName.loadMovie("url to movie.swf"); MovieClipName no código acima, é o nome do movie clip para o qual o "url to movie.swf" vai ser carregado. Lógicamente que o "url to movie.swf" vai ser o nome e endereço do SWF externo. Agora vamos analizar o código usado num dos botões. A seguinte porção de código foi retirada do botão "home". on (release) { _root.contents.loadMovie("main_content.swf"); } Basicamente, a primeira linha é que vai executar o código restante, quando acontece um determinado evento (neste caso, quando largamos o botão do rato, após termos carregado num botão). A segunda linha é onde o código loadMovie aparece. Este código é ligeiramente diferente do código do loadMovie explicado em cima, mas mesmo assim é muito similar. O nome do movie clip para o qual a animação main_content.swf vai ser carregada, chama-se contents. Foi adicionado "_root" antes de contents, porque o movie clip contents está localizado na timeline principal. Todos os outros botões têm código similar. Apenas varia o nome do SWF externo. Por exemplo, o botão locais tem como nome do ficheiro externo, locations.swf. Todas as animações podem ser visualizadas, bastando para isso ir ao directório para o qual todos os ficheiros deste tutorial foram extraidos. Agora que já completaste o tutorial, a tua página deverá funcionar correctamente. Tenta fazer a tua própria página e animações. De certeza que neste momento já és capaz!

Espero que este tutorial te tenha ajudado. Fonte:Flash Web Training

Ótimo !!
Parabéns!

Olá,

Nossa, que qualidade imensa!

Parabéns, o tutorial ficou sem dúvida alguma muito bem elaborado,
E como sou iniciante com Flash, irei aprender muito, obrigado!

Atenciosamente,
Pedro

Desculpem, mais na minha opinião sites em Flash são a pior maneira de criar sites! Se vc clica em voltar, para acessar a página que você estava anteriormente no site, volta pro local de onde vc abriu o site.

Muito bom