Flash 4

Sumrio
INTRODUO _________________________________ 3
TELA DE APRESENTAO ___________________________________ 4
BARRA DE FERRAMENTAS __________________________________ 4
PALCO (STAGE) _________________________________________ 5
LINHA DE TEMPO ________________________________________ 5
CAIXA DE FERRAMENTAS ___________________________________ 6
EDITAR CENA E EDITAR SMBOLOS ___________________________ 6
UTILIZANDO AS FERRAMENTAS _______________ 7
LINHA ________________________________________________ 7
TEXTO ________________________________________________ 9
OVAL E RETNGULO ______________________________________ 9
LPIS E PINCEL _________________________________________11
TINTEIRO _____________________________________________ 12
BALDE DE TINTA ________________________________________ 12
SELECIONA COR E BORRACHA _____________________________ 13
MO E LUPA __________________________________________ 13
SETA ________________________________________________ 14
TRABALHANDO COM A SETA _______________________________ 16
LAO _______________________________________________ 18
EDITANDO OBJETOS DO FLASH_______________ 18
TRANSFORMAR_________________________________________ 20
ORGANIZAR ___________________________________________ 21
CURVAS ______________________________________________ 21
ALINHAR _____________________________________________ 22
DESMEMBRAR__________________________________________ 23
INSPETORES ___________________________________________ 23
CORES _______________________________________________ 24
CAMADAS ____________________________________ 30
PROPRIEDADES _________________________________________ 32
COLANDO OBJETOS ENTRE CAMADAS ________________________ 37
TRABALHANDO COM OBJETOS _______________ 38
IMPORTANDO ARQUIVOS _________________________________ 41
ANIMAO ___________________________________ 46
ANIMAO QUADRO A QUADRO ___________________________ 50
ANIMAO COM INTERPOLAO ___________________________ 54
INTERPOLAO DE MOVIMENTO ____________________________ 55
INTERPOLAO DE FORMA ________________________________ 65
AVANANDO NO FLASH _______________________ 71
CENAS _______________________________________________ 71
IMPORTANDO SONS _____________________________________ 73
CLIPE DE FILME ________________________________________ 74
BOTES ______________________________________________ 75
AES _______________________________________________ 78
PUBLICANDO_________________________________ 82
EXERCCIOS _________________________________ 84
Flash 4
Pgina: 3
Celta Informtica - F: (11) 4331-1586
Flash 4
INTRODUO
O Flash uma tima ferramenta para Internet, porque inclui em um nico
aplicativo, ferramentas para criar e animar imagens grficas, elementos
de interatividade e construir a pgina HTML que permitir a exibio des-
sas imagens na Internet e total interface de elementos no navegador.
O Flash trabalha com imagens vetoriais, ao invs de Bitmaps. No forma-
to bitmap, os grficos so criados como se fossem pontilhados, onde
cada ponto, ou bit, significa uma cor, que quando aumentado ou diminu-
do, acaba fazendo o desenho perder a definio. J no formato vetorial,
as imagens so lidas como linhas e arcos, que podem ser preenchidas e
redimensionadas sem perder definio, pois toda vez que o tamanho da
imagem alterado os clculos dos vetores so refeitos.
Alm de melhor definidas, as imagens em formato vetorial so mais le-
ves, tornando o carregamento das pginas mais rpido, o que d uma
enorme vantagem para o Flash, j que velocidade o que conta na Internet,
e ningum ficar esperando muito tempo para um site ser carregado.
Os filmes do Flash so grficos vetoriais compactos; assim, o download
rpido e os filmes so rapidamente adaptados ao tamanho da tela do
usurio.
O Flash muito utilizado para criar logotipos animados, controles de
navegao, grandes animaes com som sincronizado e sites da Internet
ainda mais chamativos.
Flash 4
Pgina: 4
TELA DE APRESENTAO
Ao abrir o Flash 4.0, aparecer a janela abaixo.
BARRA DE FERRAMENTAS
Flash 4
Pgina: 5
PALCO (STAGE)
nesta rea que montamos os nossos desenhos no Flash, a rea de
Trabalho do Programa. Voc pode dar a cor e tamanho que preferir para
ele atravs do menu Modificar na opo Filme ou dando duplo-clique
no nmero de quadros por segundo da Linha de tempo
LINHA DE TEMPO
atravs da Linha de tempo que controlamos as animaes. Ele divi-
dida em camadas e quadros onde voc editar as animaes do Flash.
As camadas em que a Linha de tempo se divide, tem cada uma a sua
particularidade em relao s outras. A ordem das camadas a ordem
de sua sobreposio, mais adiante entraremos com maiores detalhes
em relao s camadas.
Flash 4
Pgina: 6
CAIXA DE FERRAMENTAS
Contm todas as ferramentas do Flash para desenhar e manipular obje-
tos.
Para cada ferramenta selecionada na caixa de ferramentas, um conjunto
de modificadores da ferramenta diferente exibido. Logo mais, sero
mostradas todas as ferramentas e seus modificadores
EDITAR CENA E EDITAR SMBOLOS
Este dois botes permitem navegar facilmente entre as diferentes cenas
e nos smbolos da Biblioteca.
Flash 4
Pgina: 7
UTILIZANDO AS FERRAMENTAS
Antes de comearmos a construir animaes no Flash, vamos utilizar
as ferramentas para criao de desenhos simples. Para isso daremos
um explicao de cada ferramenta.
LINHA
A funo da ferramenta linha relativamente simples, ela cria segmen-
tos de linha reta, parecida com a ferramenta linha da maioria dos progra-
mas.
Quando voc escolhe a ferramenta linha, aparece logo abaixo na barra
de ferramentas o modificador da ferramenta, onde voc poder escolher
a cor, o estilo e a espessura da linha que deseja desenhar.
Flash 4
Pgina: 8
Faa exemplos de linha, em diferentes cores e estilos.
Flash 4
Pgina: 9
TEXTO
Para adicionar um texto, basta clicar no Palco do Flash e digitar a men-
sagem que deseja na caixa de texto que aparecer, com o modificador
da ferramenta texto voc consegue alterar a cor e os atributos do texto e
pargrafo.
Os atributos de texto tambm podem ser alterados atravs do menu Mo-
dificar nas opes Fonte, Pargrafo, Estilo e Espaamento entre
Letras
OVAL E RETNGULO
Com a ferramenta Oval voc consegue desenhar desde crculos perfei-
tos a elipses de qualquer largura e altura. Ela pode ser desenhada como
contorno ou como preenchimento, ou os dois juntos.
A mesma coisa pode ser feita com a ferramenta Retngulo, alm de
desenhar retngulos e quadrados com seus cantos arredondados
Flash 4
Pgina: 10
Flash 4
Pgina: 11
LPIS E PINCEL
Com a ferramenta Lpis voc consegue desenhar linhas a mo livre,
como se voc estivesse usando um lpis de verdade. O modificador do
lpis tem um boto chamado Formato do lpis, este boto possui trs
outros botes que permitem a voc alterar a sinuosidade das curvas.
A ferramenta Pincel utilizada para fazer desenhos e objetos a mo
livre podendo alterar a cor e formato da ponta da caneta do pincel com o
seumodificador.
Flash 4
Pgina: 12
TINTEIRO
Modifica a cor, estilo e espessura da linha de contorno de um objeto que
no pode estar selecionado para ser modificado. No modificador da fer-
ramenta voc tem as opes de cor tamanho e estilo da linha.
BALDE DE TINTA
O balde de tinta preenche com uma cor o objeto que j foi desenhado,.
as formas de preenchimento podem ser alteradas no modificador da fer-
ramenta.
Flash 4
Pgina: 13
SELECIONA COR E BORRACHA
A ferramenta Seleciona Cor copia uma determinada cor a partir de um
objeto, no possuindo modificadores.
A ferramenta Borracha apaga um objeto inteiro ou parte dele, o modificador
da ferramenta possui trs botes, a torneira e dois botes para o formato
da borracha.
MO E LUPA
A ferramenta Mo permite a voc arrastar a janela, possibilitando alcan-
ar outras partes da imagem, sendo muito til quando a imagem est
ampliada, tambm no possui modificador.
Com a Lupa possvel aumentar ou reduzir a visualizao da rea de
trabalho, no modificador da ferramenta aparecem as opes Aumentar e
Reduzir.
Flash 4
Pgina: 14
SETA
A ferramenta Seta usada para selecionar, mover e modificar os obje-
tos, o modificador desta ferramenta possui cinco opes: Encaixar, Sua-
vizar, Acertar, Redimensionar e Girar.
Flash 4
Pgina: 15
Com a ferramenta seta voc consegue alterar os cantos e as curvas de
uma forma, distorcendo o desenho para o formato que quiser.
Flash 4
Pgina: 16
Trabalhando com a seta
Flash 4
Pgina: 17
Flash 4
Pgina: 18
LAO
Esta ferramenta seleciona reas irregulares no palco envolvendo um ou
mais objetos, o modificador apresenta trs modos de operao: Varinha
Mgica, Propriedades da Borracha e Modo Polgono.
Voc pode apagar, alterar o tamanho, girar, mover e moldar a rea se-
lecionada.
EDITANDO OBJETOS DO FLASH
Agora vamos tratar da manipulao dos objetos do Flash, como alterar
contorno, cores, agrupamento, transformao e alinhamento.
A maioria das alteraes requer que voc selecione o objeto ou parte dele.
O Flash permite que voc selecione linhas, preenchimentos ou grupos
de objetos. Para agrupar objetos, basta seleciona-los e ir no menu Modi-
ficar e na opo Agrupar.
Os objetos no Flash podem ser formas livres ou smbolos, as formas
livres so desenhos compostos por uma linha e por um preenchimento,
j os smbolos so normalmente mais complexos, formados por agrupa-
mento de imagens. H trs tipos de smbolos: Grfico, Boto e Clipe de
Vdeo.
Flash 4
Pgina: 19
Para selecionar mais de um objeto, voc tem que clicar nos objetos com
a tecla <Shi f t > pressionada, para selecionar todos os objetos voc
pode ir no menu Editar, na opo Selecionar tudo ou simplesmente
<Ct r l > + <A>, para deselecionar basta clicar numa rea sem nenhum
objeto.
Para selecionar um segmento de linha d um nico clique sobre ela;
selecione todo o contorno de uma forma com um duplo-clique sobre a
linha da forma; para selecionar o preenchimento de uma forma, d um
nico clique sobre o preenchimento; toda a forma e o seu contorno, d
um duplo-clique sobre o preenchimento.
Para selecionar objetos dentro de uma rea retangular, basta englobar
estes objetos com um retngulo de seleo que aparece quando voc
clica fora de um objeto e segura o boto do mouse, mas se preferir sele-
cionar a mo livre, basta utilizar a ferramenta Lao.
Todos os tipos de objetos podem ser apagados, movidos ou copiados do
Palco.
Para mover um objeto basta selecion-lo e arrast-lo para a nova posi-
o, se a tecla <Shi f t > for pressionada enquanto o objeto removido,
o Flash permitir que o objeto se desloque apenas para uma direo.
Para duplicar o objeto basta dar <Ct r l > + <D> com o objeto selecio-
nado, se preferir voc pode duplic-lo segurando a tecla <Ct r l > en-
quanto move o objeto de lugar, que ser removida apenas uma cpia.
Para apagar o objeto basta selecion-lo e em seguida apertar a tecla
< De l e t e > .
Flash 4
Pgina: 20
TRANSFORMAR
Atravs do menu Modificar, opo Transformar, voc pode Girar, In-
clinar, Redimensionar e Espelhar um desenho, basta que o desenho
esteja selecionado. Se preferir voc pode utilizar o modificador da ferra-
menta Seta.
Flash 4
Pgina: 21
ORGANIZAR
Para mudar a ordem dos objetos em um Quadro, (definiremos o que
Quadro mais a frente) basta selecionar um ou mais objetos e ir e na
opo Organizar do menu Modificar e escolher em qual posio voc
quer colocar o seu objeto, mais frente mis atrs de outros, ou bloque-
lo. Para que uma forma possa ser mandada para trs, ela primeiro tem
que ser agrupada para que o contorno e o preenchimento se juntem em
um s objeto.
CURVAS
O opo Curvas do menu Modificar permite algumas alteraes nos
desenhos, entre elas podemos destacar trs: Linhas para Preenchi-
mento, Expandir Forma e Atenuar Bordas, a seguir veremos um exem-
plo da opo Linhas para preenchimento.
Flash 4
Pgina: 22
ALINHAR
Para arrumar os objetos no Palco de forma correta, o Flash oferece a
opo de alinhar todos eles, para escolher esta opo basta clicar na
opo Alinhar do menu Modificar, surgir a seguinte caixa de dilogo:
O objeto pode ser alinhado horizontalmente pela direita, pelo centro ou
pela esquerda, ou verticalmente pelo topo, pelo centro ou pela base, uti-
lizando o ltimo objeto selecionado ou o Palco (alinhar pela pgina) como
base deste alinhamento. Atravs desta caixa de dilogo, voc tambm
consegue Distribuir e Redimensionar os objetos selecionados.
Flash 4
Pgina: 23
DESMEMBRAR
Esta opo permite que voc desagrupe objetos agrupados, tranforme
smbolos em objetos de forma livre, s no transforma forma livre, que j
esto separados em linha e preenchimento.
INSPETORES
Estas janelas nos permite transformar qualquer objeto utilizando valores
matemticos precisos ao invs de ser desenhado mo livre. Os inspe-
tores esto disponveis no menu Janela, opo Inspetores. Utilize o
inspetor de objeto sempre que voc quiser dar um tamanho ou posio
para o objeto sendo que X indica a posio na horizontal e Y na vertical,
essa posio tem como base o canto superior esquerdo da pgina. O W
se refere a largura do objeto e o H a altura, a unidade de medida normal-
mente o pixel, mais voc pode alterar para outra unidade no menu
Modificar, opo Filme.
Flash 4
Pgina: 24
CORES
Para criar ou alterar uma cor voc ter que abrir a janela cores na sua
tela, para isso basta ir no menu Janela e escolher a opo Cores que
aparecer a seguinte janela:
Se a cor de preenchimento que voc deseja criar for Degrad, basta clicar
na guia Gradiente da janela cores que aparecer a seguinte janela.
Flash 4
Pgina: 25
Caso deseje modificar o gradiente ainda mais, voc poder utilizar o bo-
to Transformar Preenchimento do modificador da ferramenta Balde
de Tinta.
EXEMPLO 1 BARCO.FLA
Agora vamos fazer um desenho de um barco utilizando ao mximo as
funes do Flash aprendidas at agora.
1. Altere o tamanho do Palco para 400 x 300 pixels.
2. Desenhe um retngulo amarelo claro, com contorno preto de 2 pon-
tos. D a esse retngulo um tamanho de 230 x 115 pixels, utilize o
inspetor de objeto sempre que quiser dar um tamanho ou uma posi-
o precisos para um objeto.
Flash 4
Pgina: 26
3. Mova o canto superior direito do retngulo para o lado direito, como
mostra a figura a seguir.
4. Altere o tamanho do desenho para 150 x 40 pixels.
5. Duplique o desenho e Inverta Horizontalmente uma das cpias.
6. Una as duas partes e apague a linha do meio do objeto.
7. Duplique o casco do barco e transforme a parte duplicada em um
tringulo, conforme os quatro passos a seguir.
Flash 4
Pgina: 27
8. Altere o tamanho do barco para 270x40 e do tringulo para 150x150.
9. Faa um retngulo de 6 x 165 pixels com cantos arredondados em 5
pontos, ele ser o mastro do nosso barco.
Flash 4
Pgina: 28
10. Agora que ns j temos o mastro, a vela e o barco, vamos junt-los
para que fiquem da seguinte forma:
11. Transforme as linhas da vela e do barco para que elas fiquem
mais curvadas.
Flash 4
Pgina: 29
12. O barco ficar da seguinte forma:
13. Use a opo de gradiente para colorir o seu barco e salve o arquivo
como Barco.fla
Flash 4
Pgina: 30
CAMADAS
Os objetos no Flash, alm de serem colocados na posio que voc
deseja no Palco, podem tambm ser empilhados ou divididos em cama-
das, de forma que o que voc faz em uma camada no altere a outra.
As camadas criadas no Flash nos ajudam a controlar este empilhamento
de objetos, se os objetos pertencerem a camadas diferentes, eles esta-
ro impedidos de interagirem entre si sem que voc deseje.
Na barco por exemplo, poderamos criar camadas para o barco, o mar, o
cu e outra para uma gaivota voando neste cu, a diviso em camadas
permite movimentar a gaivota sem alterar as outras camadas.
Para podermos aprender melhor sobre as camadas, vamos entender
melhor o funcionamento da Linha do Tempo, ferramenta fundamental para
criao e manipulao dessas camadas.
As camadas so empilhadas horizontalmente na Linha de Tempo, a ca-
mada na parte inferior a ultima camada do Palco que normalmente o
fundo de uma animao e a camada que fica em cima, a de primeiro
plano no Palco.
Flash 4
Pgina: 31
As camadas do Flash oferecem vrios recursos que facilitam o nosso
trabalho; a opo Bloquear camada evita que voc edite acidentalmente
uma camada, ou Ocultar uma camada que voc no queira ver, Cama-
das guia ajudam no posicionamento dos objetos e a Camada mascara-
da permite alguns efeitos de aparecer e revelar outras camadas.
Para inserir uma camada voc primeiro deve selecionar uma camada na
Linha de Tempo, no menu Inserir opo Camada ou se preferir clique
no boto adicionar camada da Linha de Tempo, a nova camada ser
colocada acima da camada selecionada e com um nome padro baseiado
no nmero de camadas j criadas, por exemplo: Camada 4, Camada 5,
e assim por diante. Voc tambm pode inserir uma camada atravs do
menu rpido, com o boto direito do mouse sobre a camada e depois
clicar na opo Inserir camada.
Para excluir uma camada basta selecion-la e clicar no boto Excluir
camada da Linha de Tempo, se preferir voc pode excluir via menu rpi-
do, clicando com boto direito em cima da camada que voc quer ex-
cluir.
Para Renomear uma camada, voc pode dar duplo-clique no nome da
camada e depois digitar o novo nome.
Flash 4
Pgina: 32
PROPRIEDADES
Tambm podemos alterar as propriedades da camada. Elas so padres
que definem a aparncia e a funo da camada. Para serem acessadas
basta clicar com o boto direito em cima da camada e escolher a opo
Propriedades..., se preferir pelo menu Modificar escolha a opo Ca-
mada. Pelas propriedades voc pode atribuir um nome para a camada,
ocultar ou mostrar, bloquear uma camada ou visualizar na forma de
contornos, apesar destas trs opes j estarem na Linha de Tempo
mais acessveis na forma de boto.
EXEMPLO 2 CAMADAS.FLA
1. Em um novo arquivo, d ao Palco o tamanho de 400 x 300 pixels.
2. Insira mais trs camadas neste arquivo.
3. Na Camada 1 faa um crculo com 140 pixels de dimetro na posio
X=30 e Y=20, e contorno com 4 pontos em preto pontilhado, com
preenchimento gradiente de preto para branco, alterado para ficar in-
clinado e mais puxado para o branco.
Flash 4
Pgina: 33
4. Na Camada 2 faa um quadrado com 130 pixels de lado na
posio=220x20, com contorno personalizado de 5 pontos, hachurado
e o preenchimento com uma cor clara.
5. Na Camada 3 digite um letra de sua preferncia com fonte Arial tama-
nho 100, a posio=50x150.
6. Na Camada 4 faa um circulo com dimetro de 100 pixels e
posio=220x80, o contorno preto com 8 pontos de largura, preenchi-
do com um gradiente arco-ris, transformando a Linha para Preenchi-
mento para que fique como na figura a seguir:
Flash 4
Pgina: 34
7. Agora renomeie a Camada 1 para Pontilhado, a Camada 2 para
Hachurado, a Camada 3 para Normal e a Camada 4 para Arco-ris.
8. Movimente os desenhos para que eles se sobreponham, como mos-
tra o exemplo a seguir, se preferir clique na nome da camada que o
desenho todo selecionado, evitando assim que voc separe partes
do desenho.
Flash 4
Pgina: 35
9. O desenho que est em primeiro plano o circulo alterado que est
na camada Arco-ris, a de cima na Linha de Tempo. Se quisermos
alterar a ordem das camadas, basta arrastar a camada de lugar com
o mouse para que eles fiquem como na prxima figura:
10. Agora a camada Hachurado est em primeiro plano e no fundo do
palco est a camada Normal. Se no quisermos que uma camada se
mova, ns podemos bloquea-la, faremos isso com a camada arco-
ris e com a camada Normal.
11. Desbloqueie primeiro as duas camadas e depois oculte as cama-
das Hachurado e camada Normal, e exibir somente os contornos das
camadas Arco-ris e Pontilhado.
Flash 4
Pgina: 36
12. Volte a visualizao de todas as camadas ao normal, exclua a ca-
mada Pontilhado e a camada Hachurado e salve o arquivo como Tes-
tando Camadas.fla.
Flash 4
Pgina: 37
COLANDO OBJETOS ENTRE CAMADAS
Para fazer cpias de objetos na mesma camada, ns j aprendemos
que basta mover o objeto a ser copiado com a tecla <Ct r l > pressiona-
da, agora vamos ver como se faz cpias de objetos entre camadas.
Esta opo funciona exatamente como em qualquer outro programa, pri-
meiro voc seleciona o objeto ou a parte dele que deseja copiar, depois
s copiar o desenho da forma que voc preferir: pela opo Copiar do
menu Editar, pelo Boto Copiar ( ) da Barra de Ferramentas ou pelo
teclado pressionando <Ct r l > + <C>.
Para colar o objeto, basta selecionar a camada onde voc queira que o
seu objeto aparea e colar o desenho atravs do Boto Colar ( ),
pela opo Colar do menu Editar ou pelo teclado pressionando <Ct r l >
+ <V>.
Quando voc cola um objeto, ele colocado automaticamente no centro
do Palco, se voc quiser que ele aparea nesta nova camada exatamen-
te na mesma posio, escolha a opo Colar no Local do menu Editar
no momento de colar o objeto.
Flash 4
Pgina: 38
TRABALHANDO COM OBJETOS
At o momento ns vimos como desenhar no Flash, agora ns vamos tra-
balhar com desenhos j feitos no prprio Flash ou em outros programas.
O Flash oferece um espao que armazena os desenhos, para que possa-
mos utiliz-los vrias vezes no mesmo filme ou em vrios outros filmes,
este espao chama-se Biblioteca.
Cada arquivo do Flash tem a sua prpria Biblioteca, nela voc pode arma-
zenar textos, sons, objetos grficos, animaes, botes e imagens bitmap
e vetorial. Os itens armazenados numa biblioteca so chamados de Smbo-
los.
Os Smbolos podem ser utilizados quantas vezes precisar, quando voc
utiliza um Smbolo da Biblioteca, na verdade estar utilizando uma Instn-
cia de Smbolo, o objeto pode ser utilizado vrias vezes, mais ocupa espa-
o uma vez s no arquivo.
Instncia seria como um clone do smbolo que alterado sempre que o
Smbolo original sofre alguma alterao.
Se voc quiser que uma instncia transforme-se em um objeto indepen-
dente, basta utilizar a opo Desmembrar do menu Modificar.
Os Smbolos nos ajudam na elaborao de animaes, seria como um
personagem de um filme ou desenho.
Para criar um Smbolo, voc deve primeiro selecionar o objeto que voc
deseja transformar em smbolo, no menu Inserir >> Converter em smbo-
lo, aparecer uma caixa de Dilogo chamada Propriedades do Smbolo,
nela voc deve escrever o nome do smbolo e o comportamento desejado
para ele.
Flash 4
Pgina: 39
Os smbolos da biblioteca tanto podem ser objetos complexos e anima-
dos como formas simples. H trs tipos de comportamentos de smbolo:
Grfico, Boto e Clipe de Filme. Por enquanto veremos apenas o pri-
meiro tipo.
Para a Biblioteca ser
visualizada, basta ir no menu
Janela e escolher a opo Bi-
blioteca ou pressionar as te-
clas <Ct r l > + <L>. E para
abrir o biblioteca de outro arqui-
vo do Flash voc utiliza o menu
Arquivo >> Abrir como Bibli-
oteca...
Caso deseje montar um smbolo a
partir do zero, basta ir no menu In-
serir >> Novo Smbolo, que o
Flash abre uma tela em branco
para voc criar um smbolo. Para
voc saber se est no filme princi-
pal ou editando o seu smbolo, bas-
ta olhar acima da Linha de Tempo,
e do lado esquerdo aparece o nome
do smbolo que voc est editan-
do, se quiser voltar para o filme prin-
cipal basta clicar na Cena que voc
pretende ir.
Flash 4
Pgina: 40
Se voc clicar com boto direito sobre o nome da smbolo da biblioteca
de smbolos, surgira vrias opes um menu rpido com algumas op-
es que alteram o smbolo.
O smbolo pode ser renomeado, duplicado, apagado e at atualizado, j
que qualquer desenho colado no Flash, automaticamente se transforma
em um smbolo.
O menu Bibliotecas oferece vrios exemplos de Grficos, Sons, Cli-
pes de filme, Botes e Botes Avanado.
Escolha alguns exemplo e arraste-os para o Palco do Flash, alguns es-
to divididos em pastas que se abrem com o duplo-clique sobre elas. Os
exemplos de animao ainda vo ficar estticos quando voc arrast-los
para o Palco, mais isso ser por pouco tempo, daqui alguns tpicos, j
estaremos animando estes e outros exemplos, mais se voc quiser ter
uma prvia de como ser a animao ou o som, clique no boto Play que
aparece nestas bibliotecas.
Flash 4
Pgina: 41
IMPORTANDO ARQUIVOS
At agora ns s utilizamos o prprio Flash para criar desenhos, mas
agora veremos como importar arquivos de outro programas para serem
animados no Flash.
Com o Flash voc pode importar tanto arquivos em formato Bitmap como
Vetorial, mais nem todos os recursos originais destes arquivos so fiel-
mente traduzidos pelo Flash.
Voc pode importar os arquivos no Flash tanto pela rea de transferncia
quanto pelo comando Importar do menu Arquivo.
Para importar uma imagem para o Flash voc pode ir ao menu Arquivo
>> Importar ou se preferir <Ctrl> + <R>, aparecer a seguinte janela:
Flash 4
Pgina: 42
Procure um arquivo que o Flash possa importar, na caixa Arquivos do
tipo mostra uma lista com os tipos de arquivo que o Flash consegue
i mportao. Como exempl o vamos i mportar o arqui vo
C:\WINDOWS\Floresta.bmp.
Flash 4
Pgina: 43
A imagem Floresta.bmp colocada no Palco e automaticamente virou
um smbolo da biblioteca, onde voc pode fazer as alteraes que dese-
jar, se voc fizer alguma alterao no arquivo original, voc pode utilizar o
comando Atualizar da biblioteca.
Se preferir, voc pode usar a rea de transferncia para colar uma ima-
gem vetorial ou bitmap. Pelo menu Editar >> Colar voc traz um dese-
nho da rea de transferncia para o seu trabalho, se preferir use a opo
Colar Especial onde possvel escolher um formato diferente para a
imagem a ser coloada.
Os imagens BITMAP importadas para o Flash podem servir tambm como
preenchimento de formas, para isso basta voc Desmembrar a ima-
gem pelo menu Modificar e depois copiar o preenchimento com o a
ferramenta Seleciona Cor, fazendo isso a cor ficar copiada e qualquer
desenho que voc faa ou pinte com o Balde de Tinta ter com esse
preenchimento.
Flash 4
Pgina: 44
EXEMPLO 3 VERO.FLA
1. Altere tamanho do Palco para 600 x 250 pixels.
2. Insira trs camadas ao arquivo.
3. Renomeie as camadas para Cu, Mar, Barco e Avio, sendo que a
camada Cu ser a camada de fundo seguida pela Camada Mar.
4. Selecione a camada do fundo e importe o imagem
C:\WINDOWS\Nuvens.bmp.
5. De para o bitmap o mesmo tamanho do Palco e a posio 0 x 0.
6. Bloqueie a camada Cu.
7. Na camada Mar faa um retngulo de 600 x 50.
D um preenchimento gradiente inclinado de um azul claro para o escu-
ro sem contorno.
8. Alinhe este retngulo pela base e centro da pgina.
9. Bloqueie a Camada Mar.
10. Abra o arquivo Barco.fla gravado num exerccio anterior.
11. Selecione este barco e converta-o em smbolo com o nome barco.
12. Feche o arquivo Barco.fla salvando as alteraes.
Flash 4
Pgina: 45
13. Selecione a camada Barco.
14. Abra o Barco.fla como biblioteca.
15. Arraste o barco da biblioteca para o Palco de forma que ele fique na
gua.
16. Altere a cor e o tamanho da vela do barco e de uma melhorada em
suas curvas. Voc pode tanto editar quanto editar no local, sendo
que as duas opes voc encontra clicando com boto direito em
cima do desenho.
17. Selecione a camada Avio.
18. Abra a biblioteca de Clipes de Filme do menu Biblioteca.
19. Arraste o clipe Avio Biplano para o Palco.
20. Altere o tamanho do avio para 110 x 50 e a posio para 13 x 8.
21. Inverta o barco horizontalmente e altere sua posio para 260x30.
22. Salve o desenho como Vero.fla
Flash 4
Pgina: 46
ANIMAO
_ Utilizaremos na animao vrios recursos das camadas que ns
aprendemos
_ Cada cena do Flash pode possuir um nmero ilimitado de camadas.
_ Na animao, utilize camadas separadas para organizar separada-
mente cada objeto da animao.
_ Cada camada contm qualquer tipo de animao, geralmente a lti-
ma delas contm uma imagem esttica. As outras camadas podem
conter uma animao separada para cada elemento.
_ As animaes em Flash podem ser desenvolvidas de duas maneiras:
Interpolao e Quadro a Quadro
QUADROS
Antes vimos a Linha de Tempo e suas opes de camada, estas cama-
das so divididas em quadros que permitem animao no Flash.
Quando voc cria uma camada na Linha de tempo, esta camada, vem
como padro com um quadro-chave, que seria um quadro a partir do
qual poder ser aplicada uma mudana na aparncia, posio ou com-
portamento do objeto.
Flash 4
Pgina: 47
Alm dos quadros-chave, a Linha de Tempo possui os protoquadros, que
so quadros cinza marcando lugar para os quadros reais que voc cria
em seu filme.
Voc pode inserir quadros-chave e quadros-chave em branco no seu
filme, para as duas opes basta selecionar o protoquadro onde voc
queira inserir estes quadros, e no menu Inserir, escolha se deseja inse-
rir um Quadro, um Quadro-chave, um Quadro-chave em branco,
Excluir Quadro ou Limpar Quadro-chave.
Se voc preferir utilizar o teclado, para adicionar um quadro = <F5>,
para apagar um quadro = <Shi f t > + <F5>, para adicionar um qua-
dro-chave em branco = <F7>, para adicionar um quadro-chave = <F6>
e para apagar um quadro-chave = <Shi f t >+<F6>.
EXEMPLO 4 ANIMANDO.FLA
Vamos fazer um exemplo da utilizao de quadros, quadros-chave e qua-
dros em branco, para isso vamos criar um novo arquivo. O palco ter o
tamanho de 300 x 300, com quatro camadas. As quatro camadas tero
os nomes da A, B, C e D.
1. No quadro 10 da camada A, insira um quadro-chave e digite a palavra
ESTOU com fonte Arial Black tamanho 48 verde, centralizada no
topo da pgina. Digite todas as palavras deste exerccio em maiscu-
las, com a mesma fonte e tamanho e centralizadas na pgina.
2. Selecione o quadro 60 da camada A e insira um quadro-chave.
3. Se voc utilizar as teclas ( <) e ( >) , conseguir se movimentar pela
Linha de Tempo.
Flash 4
Pgina: 48
4. No quadro 20 da camada B, digite a palavra ANIMANDO na cor azul
e posicione abaixo da palavra anterior.
5. Insira um quadro-chave no quadro 60.
6. Na camada C quadro 30 digite as palavras COM O... na cor verme-
lha e insira um quadro chave no quadro 60.
7. Na camada D, quadro 40 digite a palavra FLASH no tamanho 72 e
cor preta e insira um quadro chave no quadro 60.
Flash 4
Pgina: 49
8. Pronto est montado um filme simples, para voc visualizar a anima-
o, pressione <Ent er >. Se quiser controlar animao como em
um vdeo cassete, voc pode utilizar as opes do menu Controlar
ou a barra de controles, pelo menu Janela >> Controlador.
9. Se quiser ver a animao pelo Flash Player, basta utilizar a opo
Testar Filme do menu Controlar ou pressione < C t r l > +
< Ent e r > .
10.Conseguimos fazer uma animao s inserindo quadros-chave, a
velocidade desta animao que voc testou pode ser alterada na
opo QPS (Quadros Por segundo) da janela Propriedades do Fil-
me o mesmo lugar onde se altera o tamanho do palco. Vamos colocar
uma velocidade maior para os quadros e uma cor de fundo para o
palco, a velocidade pode ser 20qps e o fundo pode ser azul claro.
11.Se voc quiser ter uma prvia de como ficar a animao no nave
gador, aperte a tecla <F12>. Agora que inserimos quadros e al
guns quadros-chave vamos inserir alguns quadros em branco.
12.Insira um quadro em branco na camada A quadro 30, na B quadro
40 e na C quadro 50. Apague os quadro-chave das trs camadas
que esto no quadro 60, deixando s o da camada D.
13.Teste o filme no Flash Player ou no navegador e salve como
Animando.fla.
Flash 4
Pgina: 50
ANIMAO QUADRO A QUADRO
A primeiro forma de animao que vamos utilizar a animao quadro a
quadro, est forma semelhante ao processo de criao utilizado pelos
desenhos animados, so criadas diversos quadros seqenciais, que em
alta velocidade, mostram determinada ao.
Exemplo 5 Vero Animado.fla
1. Abra o arquivo Vero.fla
2. Adicione no quadro 40 de todas as camadas um quadro-chave.
3. No quadro 2 do avio adicione um quadro-chave.
4. Continue inserindo quadros-chave e movimentando o barca de dois
em dois quadros at o quadro 40, caso queira que o avio faa um
movimento linear, segure a tecla <Shift> enquanto o movimenta.
Flash 4
Pgina: 51
5. Visualize animao no Flash Player ou no seu navegador.
6. Note que a hlice do avio est se movendo, isto porque ns pega-
mos o avio da biblioteca de grficos animados.
7. A avio est passando na frente do barco, isto porque ele est na
camada de primeiro plano, faa o barco ficar na frente. Movimente o
barco da mesma forma que voc movimentou o avio.
8. Salve como Vero Animado.fla
Exemplo 6 Elefante Colorido.fla
Vamos fazer um outro exemplo, mas agora a animao quadro a quadro
ser pela cor.
1. Crie um arquivo com o Palco de tamanho 550 x 400, com o fundo
escuro e velocidade de exibio igual a 8qps.
2. Importe o elefante da biblioteca de grficos e altere o seu tamanho
para 455,4 x 296,4.
Flash 4
Pgina: 52
3. Alinhe o objeto para o centro da pgina.
4. Desmembre e desagrupe o elefante, permitindo com isso sua altera-
o.
5. Pinte o elefante de vrias cores.
6. Insira um quadro-chave no quadro 3 e altere as cores do elefante.
7. Continue repetindo o processo at o quadro 30.
8. Visualize a animao e salve como elefante Colorido.fla
Flash 4
Pgina: 53
Exemplo 7 Retngulo Animado.fla
1. Agora veremos um exemplo de animao quadro a quadro com mu-
dana de forma.
2. Em um novo filme, desenhe um retngulo de 224x224 no centro da
pgina.
3. Adicione vrios quadros-chave e alterando como na seqncia a se-
guir:
4. Salve a animao como retngulo animado.fla.
Flash 4
Pgina: 54
ANIMAO COM INTERPOLAO
H duas grandes desvantagens na animao quadro a quadro: ela muito
trabalhosa e deixa o arquivo grande demais.
O Flash tem uma funo que resolve os dois problemas, esta soluo
a Interpolao. Interpolar quer dizer alternar, voc fornece apenas os ob-
jetos inicial e final de uma seqncia colocando os objetos em quadros-
chave que o Flash completar o caminho do primeiro ao segundo.
H dois tipos de interpolao: Interpolao de Movimento e Interpolao
de Forma.
Na guia Interpolao da caixa de dilogo Propriedades do Quadro voc
pode escolher se quer a Interpolao de forma, de movimento ou nenhu-
ma. Clicando com o boto direito no quadro e escolhendo Proprieda-
des..., voc visualiza este dilogo onde feita a escolha do tipo de
interpolao e principalmente as alteraes para esta interpolao.
Flash 4
Pgina: 55
Interpolao de Movimento
Para um interpolao de Movimento seja colocada no filme, basta clicar
com o boto direito no primeiro ou nos quadros intermedirios de uma
seqncia e escolher a opo Criar Interpolao de Movimento, se
preferir selecionar os quadros e ir at o menu Inserir, basta escolher a
mesma opo.
Quando um quadro tem interpolao de movimento ele fica azul claro e
apresentado como uma seta na linha do tempo, se a interpolao no
estiver completa ele apresentado com uma linha pontilhada.
Se voc quiser efetuar alguma mudana na Interpolao de Movimento,
basta selecionar a guia Interpolao das Propriedades do Quadro. Com
a opo movimento selecionada a caixa de dialogo fica de seguinte ma-
neira:
Flash 4
Pgina: 56
Interpolao Redimensionamento Se ativo, a interpolao far as
mudanas nas dimenses do objeto durante a animao.
Girar Escolher a forma de rotao
Orientar a direo da trajetria Muda a orientao do objeto durante
a trajetria
Atenuao Ajusta a acelerao e desacelerao do movimento, se o
nmero for maior a animao vai ser mais rpida no incio e lenta no final
e se for menor mais lenta no comeo e rpida no final.
Sincronizar Smbolos - Certifica se as instncias do objeto vo se repe-
tir devidamente.
Encaixar na Guia Ativa o caminho desenhado para a movimentao
do objeto
Alerta de Erro - Surge quando ocorre algum problema que impea a
interpolao
Flash 4
Pgina: 57
Vamos fazer alguns exemplos utilizando a interpolao de Movimento.
Exemplo 8 Voando.fla
1. Abra o arquivo Vero.fla.
2. Exclua a camada Barco.
3. Altere a largura do Palco, do Mar e do Cu para 800 pixels.
4. Mova o avio para X = -120 e Y = 8.
5. Insira um quadro no nmero 85 das camadas Mar e Cu.
6. Adicione interpolao de Movimento quadro 1 da camada Avio.
7. Insira um quadro no nmero 10 da camada avio.
8. Os quadros ficam pontilhados, mostrando que no houve movimento,
altere a posio da instncia do avio no quadro 10 para X=630 e Y=8.
9. Visualize a animao e altere a velocidade de quadros por segundo.
10.Vamos fazer este avio dar mais algumas voltas.
11.Insira um quadro no nmero 15 e inverta horizontalmente o avio.
Flash 4
Pgina: 58
12.Insira um quadro no nmero 25 e altere a posio da instncia para
X=-245 e Y=130.
13. Insira um quadro no nmero 25 e novamente inverta horizontal-
mente a instncia do avio.
14. Insira um quadro no nmero 45 e altere o tamanho do avio para
1200x560 e a posio para X=-200 e Y=-130.
15. Insira um quadro no nmero 58 e altere o tamanho do avio para
110x50 e a posio para X=840 e Y=-0.
16. Insira um quadro no nmero 65 e altere o tamanho para 25x12 e a
posio para X=-810 e Y=0 invertendo horizontalmente.
17. Insira um quadro no nmero 80 e altere a posio para X=-30 e
Y=170.
18. Visualize a animao.
19. Quando o avio chegar bem prximo, conseguimos ler a palavra
FLASH, se voc quiser que aparea o seu nome, basta editar o de-
senho do Avio Biplano na biblioteca.
20. Salve o exemplo como Voando.fla
Flash 4
Pgina: 59
Exemplo 9 Esferas.fla
1. Em um novo arquivo, mude a cor do palco para um verde bem claro e
o tamanho para 600x400 e desenhe um crculo de 100x100 na posi-
o X=0 e Y=100, com um gradiente radial para dar impresso de
esfera.
2. Adicione interpolao de movimento a este quadro
3. No quadro 10 adicione um quadro, mova o instncia da esfera para
0x100 .
4. Adicione um quadro no 10 e mova a instncia para 700x200.
5. No quadro 20 mova para 65x500.
6. No quadro 30 mova para 250x0
7. No quadro 40 mova para a mesma posio da esfera inicial.
8. Teste a animao no seu navegador.
9. Insira mais duas camadas com outras duas esferas, e faa com que
as trs fiquem se batendo e rebatendo pelo palco.
10. Salve o arquivo com o nome de Esfera.fla
Flash 4
Pgina: 60
Exemplo 10 Estrela.fla
1. Vamos ver um exemplo que far o nosso objeto girar.
2. Em um Palco de 550x400 pixel desenhe uma estrela de quatro pontas.
3. Para um forma ser girada, primeiro ela deve ser agrupada ou conver-
tida em smbolo, vamos agrupar a estrela.
4. Crie interpolao de movimento para ela.
6. Para girar o objeto, temos que definir na caixa de dialogo Proprieda-
des do quadro como este movimento acontecer .
7. Defina o sentido e a quantidade do giro.
8. Visualize a sua animao.
9. Se quiser, voc pode girar e movimentar um objeto ao mesmo tempo,
basta mover o quadro-chave de local.
10. Salve como Estrela.fla
Flash 4
Pgina: 61
Exemplo 11 Passaro.fla
Neste exemplo veremos uma animao guiada, quando aprendemos
sobre camadas, vimos que existe uma camada que se chama camada
guia. Utilizaremos ela agora para entendermos como funciona.
1. Em um Palco de 550x400, importe a animao de um Pssaro que
est na galeria de Grficos Animados, altere o tamanho para 100x65 e
mova para o canto superior esquerdo do palco.
2. Defina interpolao para o pssaro e faa que ele se movimente at o
canto inferior direito, no quadro 40.
3. Se voc quiser ver toda a seqncia de animao basta clicar no bo-
to Papel de transparncia na Linha de Tempo.
4. Renomeie a camada para pssaro, e teste a animao.
5. Vamos agora adicionar a guia a este pssaro, o boto Adicionar Ca-
mada Guia est ao lado do boto Adicionar Camada.
6. Quando a camada guia adicionada ela assume o nome Guia mais o
nome da camada que est guiando.
Flash 4
Pgina: 62
7. Na camada Guia: pssaro, desenhe o caminho que o pssaro far de
um ponto ao outro.
8. Se voc escolher a opo Orientar direo da trajetria da caixa
de dialogo propriedades, o desenho segue exatamente a curva do seu
desenho.
Flash 4
Pgina: 63
9. O Flash coloca automaticamente a animao no caminho desenhado
com a ferramenta lpis, quando a animao for apresentada, a cama-
da guia ficar oculta.
10. Salve o arquivo como Pssaro.fla
Exemplo 12 Jogo.fla
1. Faremos agora uma animao com objetos em camadas diferentes.
2. D o tamanho 800x600 para o palco e cor bem clara para o fundo.
3. Insira mais duas camadas e de o nome de Bola, Raquete Direita, Ra-
quete Esquerda para elas.
4. Na camada Raquete Esquerda desenhe um retngulo com uma cor
de sua preferencia, com amanho 25x100 e posio 20x20.
5. Copie o retngulo, cole na camada Raquete Direita e mova para a
posio 715x45.
Flash 4
Pgina: 64
6. Temos a posio do primeiro quadro da animao, de interpolao de
movimento para os trs quadros.
7. Insira um quadro em cada camada no quadro 10.
8. Mova a bola para 635x90, a Raquete Direita para 715x70 e a Esquerda
para 20x500.
10.Mova a bola para 320x520, a Raquete Direita para 715x425 e a Es-
querda para 20x0.
11.Insira um quadro em cada camada no quadro 25.
12.Mova a bola para 45x110, a Raquete Direita para 715x50 e a Esquerda
para 20x90.
14.Mova a bola para 220x0, a Raquete Direita para 715x465 e a Esquer-
da para 20x170.
15.Na camada Raquete Direita insira um quadro no nmero 40 e mova o
retngulo para 715x215.
Flash 4
Pgina: 65
17.Mova a bola para 635x500, a Raquete Direita para 715x485 e a Es-
querda para 20x50.
19.Mova a bola para 290x0, a Raquete Direita para 715x100 e a Esquer-
da para 20x105.
20.Insira um quadro em cada camada no quadro 55 e repita as posies
do quadro 1.
21.A Animao est completa. Visualize e salve como Jogo.fla
Interpolao de Forma
Neste tipo de Interpolao voc tambm tem que definir o incio e o fim da
animao atravs de quadros-chave.
Na interpolao de forma voc consegue alterar as propriedades dos
objetos, desde que no sejam smbolos e nem estarem agrupados.
Flash 4
Pgina: 66
Com a interpolao de forma voc consegue tambm dar a impresso
de movimento, como faremos no prximo exemplo.
Dar a impresso de movimento no a principal caracterstica deste tipo
de animao, e sim transformar um objeto em outro.
Na opo forma da caixa de dilogo propriedades temos as seguintes
opes.
Tipo de Mesclagem Voc escolhe Distributiva quando os desenhos
inicial e final so mais suaves e curvados e Angular quando possuem
mais cantos e linhas retas.
Atenuao Ajusta a acelerao e desacelerao do movimento, se o
nmero escolhido for maior a animao ser mais rpida no incio e lenta
no final e se for menor mais lenta no comeo e rpida no final.
Para criar interpolao de forma, voc cria dois quadros-chave, no pri-
meiro desenha o objeto em seu estado inicial e no ltimo no seu estado
final.
Pela caixa de dilogo Propriedades do Quadro voc define o tipo de
interpolao Forma.
Os nossos prximos exemplos sero sobre este tipo de interpolao.
Flash 4
Pgina: 67
Exemplo 13 Esfera Pulando.fla
1. Desenhe uma elipse com dimenses 100x50 no quadro 1 de um novo
arquivo, com gradiente radial dando a impresso de esfera e centrali-
zada no topo do palco.
2. No quadro 10 um crculo de 100pixels de dimetro da mesma cor com
o centro da esfera alterado, e alinhado ao centro da pgina.
3. No quadro 20 outra elipse igual primeira, centralizada na base da
pgina.
4. No quadro 30 um crculo do mesmo tamanho e posio do quadro 10.
5. No quadro 40 uma elipse do mesmo tamanho e posio do quadro 1.
6. Aplique interpolao de forma e visualize a animao.
7. Abaixo vemos uma amostra de toda seqncia com o boto Seqn-
cias em Papel de Transparncia da Linha de Tempo.
Flash 4
Pgina: 68
Exemplo 14 Transformao.fla
1. Em um novo arquivo, insira no quadro o desenho de um Rato que est
na Biblioteca de Grficos.
2. Modifique as dimenses do Rato para 35x37, alinhe ao centro e na
base do palco. Para que possamos anim-lo com interpolao de for-
ma, vamos ter que tornar o grfico um desenho editvel, desagrupe e
desmembre at que o grfico se torne editvel, quando ento ficar
completamente selecionado.
3. J temos o primeiro desenho para ser transformado, vamos ter que
repetir este processo de desmembrar e desagrupar com todos os
outros.
6. Importe o desenho do Gato Preto da Biblioteca, d o tamanho 62x100
centralizado na base da pgina, alis deixe todos os desenhos centra-
lizados na horizontal e alinhados pela base da pgina na vertical.
7. Transforme o gato em editvel e inverta-o horizontalmente para que
ele esteja virado para a mesma direo que o rato
8. Aplique interpolao de forma entre os quadros 5 e 30 e visualize a
animao.
9. O rato se transformar no gato.
Flash 4
Pgina: 69
10.Insira um quadro-chave no quadro 35.
11.Insira um outro quadro-chave em branco no quadro 65 e importe o gr-
fico Homem correndo, torne-o editvel e inverta-o horizontalmente.
12.Aplique interpolao de forma entre os quadros 35 e 65 e visualize a
animao.
13.O gato se transforma em Homem.
14.Insira um quadro-chave no quadro 70
15.Insira mais um quadro-chave em branco no quadro 100 e importe o
grfico Elefante fazendo-o editvel.
16.Aplique interpolao de forma entre os quadros 70 e 100 e visualize a
animao.
17.Insira um quadro-chave no quadro 105
18.Insira o um quadro-chave em branco no quadro 135 e importe o grfi-
co Rato e torne-o editvel, de forma que ele fique na mesma posio
e tamanho do quadro 1.
19.Aplique interpolao de forma entre os quadros 105 e 135 e visualize
a animao.
20.Animao est completa, salve-a como Transformao.fla
Flash 4
Pgina: 70
Exemplo 15 Fogo.fla
Vamos agora fazer uma animao com interpolao de forma que utiliza
vrias camadas:
1. Em um novo arquivo insira duas camadas.
2. Renomeie a Camada 1 para Chama Grande, a Camada 2 para Cha-
ma Mdia e a Camada 3 para Chama Pequena.
3. Na camada Chama Grande desenhe uma elipse 100x200, na Mdia
de 60x200 e na Pequena de 20x200.
4. A elipse grande ter a cor amarela, a mdia ser laranja e a pequena
vermelha, se voc quiser utilizar cores gradiente nelas, o desenho
ficar mais interessante.
5. Alinhe todas as formas para o centro e base da pgina.
6. De 10 em dez quadros v distorcendo as formas e alternando as co-
res entre tons de vermelho e amarelo para que se parea com uma
chama.
7. Anime os quadros com interpolao de forma e visualize a animao.
8. Salve-a como Fogo.fla
Flash 4
Pgina: 71
AVANANDO NO FLASH
Ns j aprendemos a trabalhar com vrios objetos e vrias camadas,
agora veremos no Flash, como trabalhar com vrias cenas e clipes de
filme e sons.
CENAS
As cenas so como captulos de um livro, ns podemos juntar quantas
animaes quisermos por meio de cenas.
Os filmes que ns montamos at agora possuem poucos quadros, voc
pode precisar trabalhar com muito mais quadros e cansar rolar para c e
para l a Linha de Tempo.
Na hora de apresentar as animaes o Flash vai jogando uma cena atrs
da outra.
Voc pode utilizar a janela inspetora de Cena.
Esta janela lista as cenas existentes no seu documento e permite adici-
onar, excluir alterar e duplicar uma Cena. Alm desta janela, voc pode-
r utilizar o menu Inserir opo Cena.
Vamos agora colocar uma cena em uma animao.
Flash 4
Pgina: 72
Exemplo 16 Cena.fla
1. Abra o arquivo Esferas.fla
2. Insira uma cena.
3. O Flash adiciona uma cena em branco. Ao invs de montar outra
seancia, vamos utilizar o arquivo Esfera Pulando.fla.
4. Abra este arquivo e selecione todos os quadros.
5. Copie os quadros, no menu Editar existe a opo Copiar Quadros,
se voc utilizar simplesmente a opo Copiar, no dar certo.
6. Feche o arquivo Esfera Pulando.fla, no necessitando salvar as alte-
raes.
7. Clique no primeiro quadro da Cena 2 ,e cole os quadros copiados
anteriormente utilizando a opo Colar Quadros do menu Editar ou
pelo boto direito do mouse sobre o quadro 1.
8. Pronto j temos um cena adicionada a este Arquivo.
9. Volte a Cena 1 e salve o arquivo com Cena.fla.
Flash 4
Pgina: 73
IMPORTANDO SONS
Voc pode importar sons atravs do opo importar do menu arquivo ou
utilizar um dos exemplos da biblioteca de sons.
Voc arrasta o som escolhido para a animao para o quadro de onde
comear a ser executado. Se voc quiser ouvir o som antes de coloc-
lo na animao, aperte o boto Play da Biblioteca.
Exemplo 17 Sons.fla
1. Abra o arquivo Esfera Pulando.fla
2. No quadro 20, onde a bola bate, importe o som de sua preferncia.
3. Importe o mesmo som para o quadro 40.
4. Visualize a animao e salve como Sons.fla
Flash 4
Pgina: 74
CLIPE DE FILME
Voc poder transformar uma animao do Flash em um clipe de filme
para ser utilizado em outros filmes.
O processo parecido com o que ns usamos para copiar uma cena,
voc seleciona os quadros e a camada que deseja tornar um clipe de
filme, e no menu Inserir, escolha Novo... Smbolo, atribua um nome para
o seu smbolo e define o comportamento como Clipe de Filme para ele.
Basta colar os quadros copiados nesse novo Clipe.
Exemplo 18 Meteoros.fla
1. Abra o arquivo Fogo.fla e copie todos os quadros que formam a cha-
ma.
2. Crie um novo smbolo com o nome de chama e d a ele o comporta-
mento de Clipe de Filme.
3. Cole os quadros da chama no quadro 1 da camada.
4. Volte ao modo de edio e salve o arquivo.
5. Se voc abrir a biblioteca deste arquivo, ver o clipe chama.
6. Feche o arquivo.
7. Abra o arquivo Vero Animado.fla
8. Apague a camada do avio e insira uma nova camada com o nome
meteoro 1.
9. Abra o arquivo Fogo.fla como biblioteca.
10.Arraste o clipe chama para um ponto antes do palco, com uma rota-
o de 90 graus.
Flash 4
Pgina: 75
11.Diminua o tamanho do clipe e insira um guadro-chave no quadro 40.
12.Mova este quadro-chave para o outro lado do Palco.
13.Adicione movimento a estes quadros.
14.Temos o primeiro meteoro, insira vrios outros em outras camadas,
no esquecendo de fazer eles aparecerem em quadros e velocidades
diferentes para dar um impresso melhor.
15.Salve como Meteoros.fla
BOTES
muito fcil criar botes atravs do Flash, basta criar um novo smbolo
dando a ele um comportamento de boto.
Quando um objeto tem comportamento de boto, ele dividido em qua-
tro quadros-chave: Normal, Sobre, Pressionado e rea
O quadro Normal mostra como o boto ficar em seu estado normal,
sem ser clicado nem apontado; o quadro Sobre o formato do boto
quando o mouse se posicionar sobre ele; o quadro Pressionado a
forma que o boto vai adquirir quando for clicado, e o quadro rea indica
a rea ativa do boto.
Os botes que so criados no Flash podem ser completamente animados.
Flash 4
Pgina: 76
Primeiro veremos a criao e um boto simples, logo aps um boto
animado.
Exemplo 19 Botes.fla
1. Em um novo arquivo, crie um novo smbolo com o nome de BOTO
SIMPLES e comportamento de boto.
2. No quadro Normal, crie um quadrado com 100 pixels de lado, cantos
arredondados e contorno de quatro pontos, para preenchimento es-
colha uma cor de sua preferncia.
3. Alinhe o quadro para o centro do palco.
4. Para indicarmos em que formato est o boto, digite a letra N com
fonte Arial Black tamanho 72.
5. Pronto est feito o estado normal do boto.
6. Selecione o quadro Sobre e insira um quadro-chave.
7. Troca a letra N por S na figura.
8. Altere as cores do quadrado e da letra.
9. O estado Sobre do boto est feito.
Flash 4
Pgina: 77
10.Selecione o quadro Pressionado e insira um quadro-chave.
11.Troca a letra S por P
12.Altere as cores do quadrado e da letra.
13.Est pronto o estado Pressionado do boto.
14. Selecione o quadro rea e insira um quadro-chave.
15. Troca a letra P por A
16. Altere as cores do quadrado e da letra.
17. Esta feito o estado rea do boto.
18. Se voc preferir uma melhor impresso de boto, pinte as linhas
de cima e da esquerda do quadrado no estado Sobre de cinza claro e
faa a mesma coisa com a linha debaixo e da direita do estado Pres-
sionado.
19. Volte para o modo de edio e arraste o BOTO SIMPLES da
biblioteca para o palco.
Flash 4
Pgina: 78
21. Agora vamos fazer um boto animado.
22. Repita o exerccio anterior, mas ao invs de um quadrado, utilize
uma forma para cada estado do boto. D o nome de Boto animado
para ele.
23. Salve o arquivo como Botes.fla
Se voc quiser, pode fazer botes realmente animados, basta inserir um
clipe de filme em cada estado do boto.
AES
As ordens que podemos dar ao Flash sobre o que fazer aps determina-
do procedimento so chamadas Aes quadros e botes de filme.
As aes podem melhorar e adicionar interatividade s suas animaes.
Quando um quadro possuir uma ao ele ser marcado com uma letra.
Flash 4
Pgina: 79
Para acessar as aes dos quadros do Flash, voc deve abrir a caixa de
dilogo Propriedades do quadro e escolher a guia Aes:
As aes podem ser definidas tanto aos qua-
dros quanto aos botes.
Ao acessar as propriedades dos botes voc
encontrar a guia Aes. E ver que algu-
mas aes so mais simples, no necessi-
tando de nenhum parmetro para poderem
funcionar.
Quando voc escolhe uma ao para o bo-
to, poder tambm escolher quando ela
deve ser usada, por exemplo, quando o bo-
to for clicado, ou quando o cursor passar
sobre ele.
Flash 4
Pgina: 80
No exemplo acima a animao vai parar quando o usurio clicar o boto.
Exemplo 20 Aes.fla
1. Monte um novo arquivo como no exemplo abaixo, os botes podem
ser montados ou retirados do menu Bibliotecas. Os crculos em volta
do texto tambm foram importados do menu Bibliotecas.
Flash 4
Pgina: 81
2. Insira mais trs cenas no arquivo: Esfera pulando.fla, Jogo.fla e
Transformao.fla.
3. Renomeie a Cena 1 para Principal, Cena 2 para Pulando, Cena 3 para
Pssaro e Cena 4 para Viagem.
5. A o Flash est animando uma cena atrs da outra, vamos controlar
esta animao.
6. Insira um quadro-chave no quadro 10 da cena principal.
7. V at as propriedades deste quadro, e na guia aes escolha a ao
Go To, selecionando a opo Go To and Play para a cena atual e qua-
dro 1.
8. Com isso a animao vai terminar e comear de novo at que outra
ordem seja dada.
9. Nas outras cenas insira dois botes com os nomes de Principal e
Parar.
10.Vamos agora colocar aes neste botes.
11.Na cena Principal, clique nas propriedades do boto Pulando.
12.Escolha a ao Go To and Play, para a cena pulando.
13.Teste a animao.
14.Na cena pulando use a ao Go To and Play para que ele volte para a
cena Principal.
15.Volte para a cena pulando e use a ao Stop para o boto parar.
16.Repita este processo para todos os botes e visualize esta anima-
o.
17.Salve a animao como Aes.fla
Flash 4
Pgina: 82
PUBLICANDO
Para definir como seu filme ser publicado voc deve ir ao menu Arqui-
vo >> Definies de Publicao, surge uma caixa de dialogo com trs
guias: Formatos, Flash e HTML.
Flash 4
Pgina: 83
Nesta caixa de dilogo voc escolhe todos as definies para o seu fil-
me.
Agora s publicar o filme pela opo Publicar do menu Arquivo, ou
pelas teclas <Shi f t >+<F12>.
Com o arquivo publicado basta abrir atravs de seu navegador, ou se
preferir voc poder pressionar a tecla <F12> que a animao ser
atualizada e visualizada ao mesmo tempo, automaticamente.
Flash 4
Pgina: 84
EXERCCIOS
1. Crie uma transformao envolvendo os grficos Homem-boca e
Duende da biblioteca de grficos. Salvando o arquivo como
Metamorfose.fla.
2. Crie um animao em que o avio d piruetas no ar. Salvando como
Piruetas.fla.
3. Utilize o clipe da chama para criar a imagem de uma vela acesa. Sal-
ve como Vela.fla.
4. Crie um semforo alternando entre o verde, amarelo e vermelho. Sal-
ve como Semfaro.fla
5. Crie um animao onde o dia comece ensolarado, e transforma-se
em uma noite com o cu estrelado e lua cheia. Salve como Dia
Perfeito.fla
6. Desenhe um carro que atravessa o palco com as rodas girando. Se
for possvel, importe um carro de algum Clip-Art.
7. No palco do exerccio anterior tero dois botes, um chamado PARAR
e o outro chamado SEGUIR, adicione um som de freada quando o
carro parar. Salve como Carro.fla
8. Crie uma animao onde um avio decole, d algumas voltas e de-
pois pouse, o avio pode ser de qualquer Clip-Art, ou do prpria biblio-
teca do Flash. No esquecendo que o objeto tem que ser vetorial.
9. Crie uma animao com a frase VAMOS DETONAR COM O FLASH,
utilize o mximo de recursos possveis para esta animao. Salve
como detonar.fla.
10.Duplique a Clipe de Filme do avio biplano e personalize, colocando
um piloto na cabine que pode ser uma foto sua escaneada ou um Clip-
Art de sua escolha.
11.Faa uma animao com este clipe. Salve como Meu avio.fla.
12.Crie a animao de um foguete ou avio a jato utilizando o Clipe da
Chama para sair da turbina adicione um som de jato se possvel. Sal-
ve com jato.fla.
Flash 4
Pgina: 85
13.Monte um site com o Flash que venda algum produto, utilize os dese-
nhos do Flash ou de outro programa com Clip-Art. Salve com Meu
Site.fla
14.No menu Janela voc encontra alguns Exemplos do Flash, abra-os e
veja que possvel fazer muitas animaes com esse programa.
15.Procure por sites que utilizem o Flash e tente repetir as animaes
encontradas.
Celta Informtica
http://www.celtainformatica.com.br

Flash 4

Transféré par

Informations du document

Description originale:

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Flash 4

Transféré par

Droits d'auteur :

Formats disponibles

Sumrio

Vous aimerez peut-être aussi