Beruflich Dokumente
Kultur Dokumente
0 ON LINE
INTRODUO
MENUS DO FLASH
FERRAMENTAS DO FLASH
OUTRAS FERRAMENTAS DO FLASH
CONCEITOS FUNDAMENTAIS
EFEITO TWEENING MOTION
EFEITO ADD MOTION GUIDE
EFEITO SHAPE
SMBOLOS
BOTO ANIMADO
EFEITO MASK - MSCARA
SOM
BOTES AVANADOS E CENAS
TRATAMENTO DE IMAGENS
ACTIONS - AES
NOES DE FLASH SCRIPT
FORMULRIO
COMO PUBLICAR UMA ANIMAO EM HTML
COMO CRIAR ARQUIVO EXECUTVEL
TRATAMENTO DE IMAGENS
MOVIE CLIP
DRAG MOVIE CLIP
TELL TARGET
IF FRAME IS LOADED
LOAD / UNLOAD MOVIE
CALL
LOJA VIRTUAL
CHAT ANIMADO
DICAS FINAIS
Este Curso tem por objetivo ensinar criar animaes com o programa Flash 4.0 da
Macromedia e aceito sem plugin no Windows 98 , Internet Explorer 4.0 ou superior e
Netscape 4.5 ou superior. Verses anteriores destes browsers necessitam de plugin que
pode ser obtido no prprio site da Macromedia.
MENU DO FLASH
Go to ir para
100% visualizar o tamanho original da animao
Show Frames exibir frames
Show All exibir tudo
Outlines exibir contornos
Fast
Antialias no exibir serrilhamento no objeto
Antialias Text no exibir serrilhamento no texto
Timeline exibir linha do tempo
Work Area exibir rea de trabalho
Rulers exibir rguas
Grid exibir grade
Snap exibir im
Show Shape Hints exibir shape hints, quando se usa o efeito Shape
Instance mod
Frame ifica
mod
Layer r
ifica
mod
Scene r
ifica
mod
Movie r
ifica
mod
Font r
ifica
mod
Paragraph r
ifica
mod
Style r
ifica
mod
Kerning r
ifica
mod
Text Field r
ifica
mod
rScal
ifica modificar escala
respa
eRot
cam modificar rotao
ate
Scal modificar escala e rotao
e
Rot rotacionar esquerda
ate
Rot rotacionar direita
Transform ate
Flip rotacionar 180 na vertical
Vert
Flip rotacionar 180 na horizontal
Hori
Rem remover modificaes
ove
Edit editar centro
Cen
Rem remover cores
ove
Add adicionar Shape Hints ( Efeito Shape )
Sha
Rem remover Shape Hints ( Efeito Shape )
Arrange ove
Brin trazer para frente
g to
Mov
eMov mandar para trs
Beto Marques - Curso de Flash 4.0 On Line
5
Sen
d to trancar
destrancar tudo
otimizar
Curves
Buttons botes
Buttons-
botes avanados
Advanced
Graphics grficos
Movie Clips trechos de animaes
Sounds sons
Inspectors
Frame
Transform
Scene
Generator
Controler
Colors
Output
Generator abrir objetos do
Objects Generator , caso
Library abrir sua biblioteca
FERRAMENTAS DO FLASH
Brush Mode :
* Paint Normal pintar normal
* Paint Fills pintar preenchimentos
* Paint Behind pintar atrs
* Paint Selection pintar seleo
* Paint Inside pintar dentro
Fill Color cor de preenchimento
Brush Size tamanho do pincel
Brush Shape tipo de pincel
CENAS E SMBOLOS
Scene 1 - Visualiza Cena
LAYER CAMADA
FRAMES - QUADROS
CONCEITOS FUNDAMENTAIS
TIMELINE - LINHA DO TEMPO
ALINHAMENTO DE DESENHO
Para alinhar > seleciona o desenho > Crtl K ou Modify > Align
Frame Rate - define quantos frames por segundo , por default 12.0
Dimensions - define as dimenses da rea de trabalho
Match - Printer - define tamanho exato da impresso
Match - Contents - reajusta o tamanho da tela para somente o espao que foi ocupado a
animao
Grid Spacing - define tamanho da grade
Grid - exibir ou no a grade para auxiliar a desenhar a animao
Colors - Grid - define a cor da grade
Colors - Background - define a cor do fundo da animao
O efeito Add Motion Guide a maneira que voc cria os caminhos por onde passar sua
animao ,mas para que ocorra o Add Motion Guide, voc deve criar primeiramente o
Motion Tweening
( conforme mencionamos no captulo anterior )
Para controlar melhor a deformao do morphing usado o Efeito Add Shape Hints
atravs de marcadores , mas ele s funciona se criar primeiro um shape entre dois
objetos
1. File > Import e importe uma imagem com extenso png e 72 dpi de resoluo
2. Selecione a ferramenta Arrow ( Seta )
3. Selecione a imagem > Crtl + B ou Modify > Break Apart para transformar a imagem
em bitmap
4. Insira um keyframe na linha do tempo = 50
5. Deselecione a imagem
6. Digite sobre a imagem : E F E I T O em arial back, 48 e pinte de uma cor
7. Clique sobre a imagem e delete
8. Selecione o texto > Crtl + B ou Modify > Break Apart para transformar o texto em
bitmap
9. Selecione a linha do tempo = 1 at 49
10.Boto direito do Mouse > Properties > Tweening > Shape > Angular
11.Salve sua animao , neste caso, exer09.fla
12.Crtl + Enter
13.Para voltar rea de trabalho > Crtl + F4
SMBOLOS
Os smbolos podem ser : graphic ( grfico ) , button ( boto ) e movie clip ( pequena
animao )
graphics ( grficos )
sounds ( sons )
PROPRIEDADES DE UM SMBOLO
DEFINITION - DEFINIO
Switch Symbol
ACTION - AO
BOTO ANIMADO
ESTGIOS DO BOTO
Observao : Quando se transforma um objeto em boto , ele tem uma opo : Tracking
Options que possui duas opes : Track as Button que evita que outros botes recebam a
Ao " On Mouse Events " enquanto o mouse est no estgio down ; Track as Menu
Item que permite que outros botes recebam a Ao " On Mouse Events - Release "
EXERCCIO 13 - BOTO 1
EXERCCIO 14 - BOTO 2
O Efeito de Mscara cria layers ( camadas ) que escondem parte de outros layers que
estejam abaixo do layer em que foi criada a mscara
Observao : Neste exemplo pode-se tambm inserir uma imagem como padronagem,
de preferncia em extenso png com 72 dpi de resoluo , e fazer o mesmo efeito
1. Este exemplo uma simulao de uma imagem esttica transformando numa cena de
vdeo , ou seja, no uma gif animada
2. O tamanho do arquivo ser de 200 x 150
3. File > Import e importe uma imagem com extenso png , resoluo 72 dpi
4. Com a imagem selecionada > F8 e transforme em smbolo grfico : foto
5. Renomeie o layer de foto
6. Insira um keyframe na linha do tempo 60
7. Com a imagem selecionada > Modify > Transform > Scale e Rotate
8. Scale = 60 e Rotate = 0
9. Centralize a imagem no centro da tela
10.Selecione a linha do tempo 1 > Create Motion Tweening
11.Insira um layer acima
12.Renomeie de retngulo
13.Desenhe um retngulo que ocupe 90% da tela e pinte de qualquer cor
14.Clique no frame 1 deste layer > Properties > Actions
15.FSCommand > Command = allowscale e Arguments = false
16.Clique no layer retngulo com o boto direito do mouse > Mask
17.Salve o arquivo como exer18.fla
18.Crtl + Enter e teste sua animao
19.Crtl + F4 para voltar area de trabalho
SOM
O Flash aceita somente as extenses wav e aif e no importa MP3 . O Flash 4.0 ao
gerar um arquivo .swf, ele pega os arquivos wav ou aif e usa a compresso do MP3 para
compact-lo
http://www.goldwave.com
http://www.soundforge.com
MPEG ( Picture Experts Group ) , mais conhecido com MP3 um conjunto de tcnicas
de compresso para udio e vdeo que reduz o tamanho dos arquivos 1/12 do original
Para tocar um arquivo MP3 necessrio utilizar um player ; os mais conhecidos so o
WinAmp e o Microsoft Media Player 4.0 que vem junto com o Windows 98.
http://www.winamp.com
Beto Marques - Curso de Flash 4.0 On Line
36
Uma vez instalado no seu computador, todas as vezes que for aberto uma arquivo em
MP3, o WinAmp aberto e roda a msica.
http://www.mp3.com
http://www.emusic.com
http://www.mp3place.com
EFFECTS - EFEITOS
None Nenhum efeito
Left O som sai na caixa de som da esquerda
Channel
Right O som sai na caixa de som da direita
Channel
Fade Left to O som comea na caixa de som esquerda e termina na direita
Right
Fade Right O som comea na caixa de som direita e termina na esquerda
to Left
Fade In O som vai aumentando aos poucos
Fade Out O som vai diminuindo aos poucos
Custom Default do Flash
TRILHA SONORA
http://www.wavcentral.com
http://www.triage.easynet.co.uk/just.htm
http://www.soundz.com
ftp://ftp.htc.dk/pub/WAV
http://www.stoutman.com/wavs/index.html
ACTIONS - AES
GO TO AND STOP
seleciona que deve ir para determinada parte da animao e parar
Scene selecione a cena
Frame seleciona o frame
Label seleciona o label ( rtulo )
Expression seleciona a expresso em javascript ; abrir uma caixa onde inserido a
expresso ; clicando no boto da direita abrir o editor de javascript
Next Frame seleciona prximo frame
Previous Frame seleciona o frame previsto
Go to and Play caso seja selecionado, que deve ir para determinada parte da animao
e rodar a animao
PLAY
determina que em determinado frame a animao ir rodar
STOP
determina que em determinado frame a animao ir parar
GET URL
Determina uma pgina em html a ser linkada , um email ou para onde ir os dados de
um formulrio
URL digite : http://www.betomarques.com/flash4 ; ou
mailto:webmaster@betomarques.com ou
http://www.abc.com/cgi-bin/formmail.pl
Windows caso a pgina seja em frame , determina o target ( alvo ) do frame
Variables determina qual o mtodo de envio do formulrio : Post ou Get
FSCOMMAND
Determina comandos especiais no Flash
Commands Arguments Definio
IF FRAME IS LOADED
determina que a animao ir rodar. Somente quando for totalmente carregada ;
efeito : Imagens Carregando ....
Scene determina a cena
Frame determina o frame
Expression determina o script
ON MOUSE EVENTS
determina um efeito quando o mouse passa sobre o smbolo boto
Press pressionar
Release clicar dentro da rea boto ( default do Flash ) ; a ao exercida
quando aperta o boto no estgio Down
Outside Release clicar fora da rea do boto
Roll Over passar por cima do boto ; usado em menus com submenus ( Track as
Menu )
Roll Out sair de cima do boto ; acontece quando o cursor sai de cima do
estgio Hit do boto
Drag Over clicar em qualquer parte e arrastar para dentro do boto
Drag Out clicar dentro do boto e arrastar para fora do boto
Key Press Pressionar determinada chave
IF
Condition Caso uma ao seja verdadeira, determina uma ao
Add Else / Else If clause Adicionar outra / adicionar outra se
LOOP
Condition Determina uma ao, enquanto for uma condio for verdadeira
SET PROPERTIES
Set Determina propriedades do movie clip
Target Determina o alvo
Value Determina valores s propriedades do movie clip
SET VARIABLES
Variable Determina variveis
Value Determina valores s variveis
TRACE
Message Determina o valor de uma expresso ou string
ACTION SCRIPT
OPERADOR GERAL
() define expresso ou seja a varivel
OPERADORES NUMRICOS
+ adio
- subtrao
* multiplicao
/ diviso
= igual
<> desigual
| Ou
> Maior
>= Maior ou igual
< Menor
<= Menor ou igual
OPERADORES DE STRING
Determina a string
& E para strings
eq Igual para strings
Ne Desigual para strings
It Menor para strings
gt Maior para strings
le Menor ou igual para strings
ge Maior ou igual para strings
Beto Marques - Curso de Flash 4.0 On Line
43
OPERADORES LGICOS
and E
or ou
not no
FUNES GERAIS
eval Determina valor da varivel
false Falso
true Verdadeiro
newline Nova linha
GetTimer Determina milsimo de segundos que a animao comeou a rodar
FUNES NUMRICAS
Int (var ) Declarao de uma varivel com nmeros inteiros
Random Cria um nmero entre 0 e -1
FUNES DA STRING
Substring Determina uma substring
Length Determina comprimento da string
Chr Determina em ASCII valores string
Ord Determina string valores em ASCII
PROPRIEDADES
GetProperty Determina a propriedade de origem do Movie Clip
_x Determina posio x do MovieClip
_y Determina posio y do Movie Clip
_width Determina largura do Movie Clip
_height Determina altura do Movie Clip
_rotation Determina rotao do Movie Clip
_target Determina o alvo do Movie Clip em caso de uso de frames
_name Determina nome da instncia do Movie Clip
_url Determina a URL de um boto Movie Clip
_xscale Determina valor em porcentagem de x do Movie Clip
_yscale Determina valor em porcentagem de y do Movie Clip
_currentframe Determina o frame corrente do Movie Clip
_totalframes Determina o nmero de frames do Movie Clip
_framesloaded Determina o nmero de frames carregados do Movie Clip
_alpha Determina a quantidade de alpha do Movie Clip
_visible Determina a visibilidade do Movie Clip
_droptarget Determina que o Movie Clip seja arrastado para outro Movie Clip
MBString
MBLength
MBChr
MBOrd
BOTES AVANADOS
EXERCCIO 26 FORMULRIO
1. Clique em 12.0 fps e marque ( x ) Grid para que seja exibido a grade
2. Clique no im para que ele permanea ativado
3. Desenhe um retngulo em azul claro de 6 quadradinhos x 1
4. Selecione todo o polgono > Crtl G para agrupar
5. Pule um quadradinho
6. Desenhe um retngulo em azul claro de 12 quadradinhos x 1
7. Selecione todo o novo polgono > Crtl G para agrupar
8. Selecione os dois retngulos e Crtl + D para duplicar
9. Com as setinhas do teclado arraste a cpia dos quadrados para parte de baixo dos
quadrados
10.Repita o mesmo procedimento duplicando criando no total de 6
11.Selecione a primeira coluna de quadrados > Crl + K para alinhar
12.Selecione a segunda coluna de quadrados > Crl + K para alinhar
13.Selecione a ferramenta de texto > Arial Black > 12 > Preto
14.Digite a palavra Nome
15.No quadrado abaixo : Email , depois Endereo , Cidade , Cep e Estado
respectivamente
16.Selecione todos os textos > Crtl K para alinhar
17.Selecione a ferramenta texto > e a ferramenta auxiliar > Text Field
18.Coloque o cursor no quadradinho ao lado de Nome para inserir campo de
preenchimento e aumente at que ocupe toda o quadradinho
19.Coloque o cursor no quadradinho ao lado de Email para inserir campo de
preenchimento e aumente at que ocupe toda o quadradinho
20.Coloque o cursor no quadradinho ao lado de Cidade para inserir campo de
preenchimento e aumente at que ocupe toda o quadradinho
21.Coloque o cursor no quadradinho ao lado de Cep para inserir campo de
preenchimento e aumente at que ocupe toda o quadradinho
22.Coloque o cursor no quadradinho ao lado de Estado para inserir campo de
preenchimento e aumente at que ocupe toda o quadradinho
23.Selecione o campo de preenchimento de Nome > boto direito do mouse > Properties
> Text Field Properties ou Modify > Text Field
24.No item Variable digite : Nome e marque somente (do not include font outlines )
25.Selecione o campo de preenchimento de Email > boto direito do mouse > Properties
> Text Field Properties ou Modify > Text Field
26.No item Variable digite : Email e marque somente (do not include font outlines )
27.Selecione o campo de preenchimento de Endereo > boto direito do mouse >
Properties > Text Field Properties ou Modify > Text Field
Beto Marques - Curso de Flash 4.0 On Line
57
28.No item Variable digite : Endereco ( sem pois como os programas que rodam
formulrios so em ingls , eles no aceitam , hfen e acentos no campo de
preenchimento ) e marque somente (do not include font outlines )
29.Selecione o campo de preenchimento de Cidade > boto direito do mouse >
Properties > Text Field Properties ou Modify > Text Field
30.No item Variable digite : Cidade e marque somente (do not include font outlines )
31.Selecione o campo de preenchimento de Cep > boto direito do mouse > Properties >
Text Field Properties ou Modify > Text Field
32.No item Variable digite : Cep e marque somente (do not include font outlines )
33.Selecione o campo de preenchimento de Estado > boto direito do mouse >
Properties > Text Field Properties ou Modify > Text Field
34.No item Variable digite : Estado e marque somente (do not include font outlines )
35. Libraries > Button ( Biblioteca > Boto )
36.Escolha o boto Push Boto Red e arraste para parte de baixo do formulrio
37.Modify > Transform > Scale and Rotate
38.Scale : 50 ; Rotate : 0
39.Clique sobre o smbolo boto com o boto direito do direito
40. Aqui voc deve inserir o programa que roda os formulrios aonde esteja hospedada a
pgina, neste exemplo , ser o formmail.pl
Action > Set Variable
On (Press)
Variable: recipient ; value : digite seu email
Variable: subject ; value : digite : Cadastro de Alunos ( assunto do email a ser
enviado com os dados preenchidos )
Variable : title ; value : Cadastro de Alunos ( ttulo da pgina de confirmao )
Variable: bgcolor ; value: #EAEAAE ( cor de fundo da pgina de confirmao )
Variable: required ; value : Nome,Email ( campos obrigatrios )
Variable: text_color ; value : #000080 ( cor do texto na pgina de confirmao )
Get URL
URL : http://www.provedor.com.br/cgi-bin/formmail.pl
Variables : post
41.Clique em 12.0 fps e mude o fundo para azul escuro e desmarque o grid para que ele
seja desativado
42.Salve o arquivo como exer26.fla
43.Crtl + Enter e teste sua animao
44.Crtl + F4 para voltar area de trabalho
Observao :
* playback determina comandos para rodar a animao que so inseridos nas tags
<object> e <embed>
a ) paused at start determina que a animao s ir rodar , se houver um boto
com uma ao paly ( rodar ) ; recomendvel deixar este item desmarcado para que a
animao carregue normalmente
b ) loop determina quantas vezes a animaco ir rodar
c ) display menu determina a exibio do menu da animao para o usurio
d ) device font determina que o usurio visualize no seu computador uma fonte
sem serrilhamento ( anti-aliasing ), mesmo que no tenha esta fonte instalada
* scale
a ) default determina que a animao ser exibida no tamanho que foi criada e em
algumas vezes poder aparecer as bordas
b ) no border determina que a animao ser exibida no tamanho que foi criada e
sem bordas
c ) exact fit determina que a animao ser exibida no tamanho que foi criada ,
mesmo que haja perda na qualidade da animao
Como originalmente
TRATAMENTO DE IMAGENS
As extenses aceitas : bmp , gif , png , wmf, eps e dxf . O jpg aceito, mais quando
vetorizada no Flash , ela perde muito a resoluo , por isto, aconselhvel a no us-lo.
Beto Marques - Curso de Flash 4.0 On Line
62
A melhor resoluo png para imagens importadas. O wmf aumenta muito o arquivo , e
a melhor compresso de imagens no flash a swf ( do prprio flash )
Observaes
1. Quando voc importa um arquivo ele vem com bitmap > perde qualidade e cresce o
tamanho do movie.
2. No vale a pena vetorizar na maiorias dos casos no flash , pois perde a resoluo ;
uma maneira seria antes de importar, salvar sua imagem num editor de imagens como
bmp e depois importar para o Flash
3. Quando voc copia (Ctrl+C) do Corel/Free Hand e cola (Ctrl+V) no flash , ele vem
com o vetorial, a qualidade fica boa mas tambm fica muito grande o movie
4. Use as ferramentas de desenho do Word 97 que com elas podem fazer desenhos 3d , e
quando voc copia e cola no flash o arquivo vem bem pequeno :
No Word - criei um quadrado e ativei o 3D > Crtl + C > Flash3 > Ctrl + V > Modifty
> Break Apart duas vezes ou Crtl + B e agrupe a imagem Crtl + G
Caso faa um desenho chapado no Flash copie e cola no Word 97 e use as
ferramentas de desenho e coloque em 3d
5. No Corel as imagens feitas no Corel em WMF (Windows Meta File).
6. No Photoshop as imagens devem ser feitas em PNG
7. No Freehand - as imagens devem ser feitas usando o comando ANIMATE do Xtras e
depois exporta para SWF e importa no Flash 3
Observao : Quando se importar uma imagem ela logo ser inserida na sua Library ;
Modify > Curves > Optmize ou Ctrl + Alt + Shift + C ; elimina as curvas
desnecessrias
1. Outra forma para simular transparncia : para vetorizar Modify > Trace Bitmap
2. Deletar as imagens da imagem da mesma forma
3. Clique fora da figura para deselecionar
Observao
1. Para dar efeito fundo transparente : crie sua animao com um fundo preto e salva ;
2. S funciona no Windows e Internet Explorer verso 4.0 ou superior ;
3. As cores aceitas para transparncia no Flash so as cores que esto na paleta de cores
do Flash.
4. No cdigo html colocar os parmetros :
http://www.macromedia.com/support/flash/how/subjects/wless2/wless02.html
IMAGENS EM 3D
Existe um plugin chamado Illustrate para 3DS Max 2.5 que renderiza a sua animao
3D diretamente em swf em grficos vetorais. A verso demo pode ser obtida :
http://www.davidgould.com
MOVIE CLIP
2 PARTE - SUBIR
3 PARTE - DESCER
Beto Marques - Curso de Flash 4.0 On Line
69
1. Windows > Library
2. Selecione o smbolo seta > Options > Duplicate
3. Name : descer ; behavior : movie clip
4. Observe que tem dois layers : seta e ao
5. Selecione o smbolo da descer
6. Modify > Transform > Scale and Rotate
Scale : 100 ; Rotate : 180
7. Selecione o layer ao
8. Observe que na linha do tempo 1 > Properties > Action > Stop
17.Observe que n a linha do tempo 2 > Properties > Action
Tell Target > Target = ../rolar
Go to Previous Frame ; troque para Go to Next Frame
18.Observe que na linha do tempo 3 > Properties > Action
Go to and Play ; Frame : 2
19.Selecione a linha do tempo 1 do layer seta
20. Observe no smbolo seta > Properties > Actions
On Mouse Events > Press and Drag Over
Go to and Play > Frame : 2
Selecione End On
On Mouse Events > Release and Drag Out
Go to and Stop > Frame : 1
4 PARTE
A ao Drag Movie Clip possibilita que o usurio ao clicar um objeto na animao possa
moviment-lo na tela e usado no Flash 4.0 para criar games e lojas virtuais.
Os passos para transformar um objeto com ao Drag Movie Clip :
TELL TARGET
Tell Target envia aes para uma determinada instncia de um smbolo. Instncia uma
cpia de um smbolo que pode ser modificada tantas vezes forem necessrias, sem
alterar a original.
1. Libraries > Movie Clip > Star Spinning e arraste para rea de trabalho
2. Arraste o mesmo movie clip mais trs vezes > totalizando quatro Star Spinning
3. Selecione o segundo Star Spinning > Properties > Color Effect
4. Tint > e pinte de verde
5. Selecione o terceiro Star Spinning > Properties > Color Effect
6. Tint > e pinte de azul
7. Selecione o quarto Star Spinning > Properties > Color Effect
8. Tint > e pinte de amarelo
9. Selecione a estrela vermelha > Properties
10.Definition > Instance Name : estrela1
11.Selecione a estrela verde > Properties
12.Definition > Instance Name : estrela2
13.Selecione a estrela azul > Properties
14.Definition > Instance Name : estrela3
15.Selecione a estrela amarela > Properties
16.Definition > Instance Name : estrela4
17.Selecione a linha do tempo = 1 > Properties > Action
Tell Target ; target : /estrela1
Stop
Selecione End Tell Target
Insira outro Tell Target ; target : /estrela2
Stop
Selecione End Tell Target
Insira outro Tell Target ; target : /estrela3
Beto Marques - Curso de Flash 4.0 On Line
77
Stop
Selecione End Tell Target
Insira outro Tell Target ; target : /estrela4
Stop
18.Windows > Library > Options > New Symbol
19.Name : invisvel ; behavior : movie clip
20.Neste smbolo no ir desenhar nada, ele servir apenas para comandar as aes do
Tell Target
21.Insira blank keyframe na linha do tempo 15 , 30 e 45
22.Insira frame na linha do tempo 60
IF FRAME IS LOADED
REGRA BSICA
OBSERVAES
Para abrir um swf dentro de outro, adicionando uma ao, por exemplo, a um boto,
atravs do Load Movie. Os argumentos so:
LOJA VIRTUAL
Uma das inovaes do Flash 4.0 que ela possibilita criar Loja Virtual ou WebStore e
para se criar uma , voc precisa ter conhecimentos em programao. Uma maneira
simples de cria um Loja Virtual :
1. Criar um movie clip com o produto que estar disponvel para compra
2. Dar o nome da Instncia : Instance Name : produto1
3. Nele voce coloca um botao invisivel com os action start drag (on press) e stop drag
(on release). O primeiro passo seria so isso para fazer o produto ser arrastado.
4. Criar um movie clip como cesta de compras
5. Dar o nome da Instncia : Instance Name : cesta
6. Criar um boto comprar onde ser inserido as actions de clculo, ou seja, teria que
verificar atravs da actions Ifs quais os movie clips esto dentro da cesta. Isso
possivel fazer atravs do GetProperty de x
Por exemplo , se o produto1 estiver dentro da cesta ento deve efetuar o clculo, ou
seja , fazer o clculo de acordo com o nome do textfield ( campo de preenchimento )
que esta no formulrio de pedido
7. Caso tenha outros produtos necessrio colocar uma action If apontandando a
varivel correspondente ao textfield ( campo de preenchimento ) da sua quantidade
8. Para evitar que o usurio arraste um produto para lado ( eixo x fica menor ) e a
compra computada , insira uma outra action If para que ela verifique se a posio y
do produto seja menor que a posio de y na cesta de compras; delimitando a regio ,
j que x e y do produto tem que ser menor
9. O eixo x da cesta tem que ser menor que o eixo x dos produtos para que eles fiquem
dentro da cesta. Para verificar melhor essa condicao : ponto x e y dos movie clips
devem estar em posies diferentes, exemplo :
* na edio do movie clip dos produtos , o smbolo tem que ficar no lado esquerdo
Beto Marques - Curso de Flash 4.0 On Line
85
( na parte de cima ) do sinal ( + ) na edio do smbolo
* na edio do movie clip da cesta , o smbolo tem que ficar no lado direito ( na parte
de baixo ) do sinal ( + ) na edio do smbolo
1. Neste exemplo vamos fazer uma Loja Virtual de botes para camisas;
sero trs tipos de botes : produto1 , produto2 e produto3
2. Window > Library > Options > New Symbol
3. Name : produto1 ; behavior : graphic
4. Desenhe um boto de camisa
5. Crtl K para centralizar
6. Crie mais dois smbolos grficos , ou seja dois botes de camisa , e os renomeie de
produto2 e produto3 respectivamente
7. Window > Library > Options > New Symbol
8. Name : boto1 ; behavior : button
9. Arraste da Library o smbolo produto1
10.Crtl K para centralizar
11.Deixe os estgios over, down e hit vazios
12.Window > Library > Options > New Symbol
13.Name : boto1_mov ; behavior : movie clip
14.Arraste o smbolo boto1 para edio do movieclip
15.Importante : posicionar o boto do lado esquerdo do sinal ( + ) na parte de cima
16.Clique sobre o boto1 > Properties > Action
On Mouse Events ; ( x ) Press
Drag Movie Clip : ( x ) Start Drag Operation ; target : /produto1 ; ( x ) Lock mouse
to center
Selecione End Drag
On Mouse Events ; ( x ) Release e ( x ) Release Outside
Drag Movie Clip ; ( x ) Stop Drag Operation
17.Window > Library > Options > New Symbol
18.Name : boto2 ; behavior : button
19.Arraste da Library o smbolo produto2
20.Crtl K para centralizar
21.Deixe os estgios over, down e hit vazios
22.Window > Library > Options > New Symbol
23.Name : boto2_mov ; behavior : movie clip
24.Arraste o smbolo boto2 para edio do movieclip
25.Importante : posicionar o boto do lado esquerdo do sinal ( + ) na parte de cima
26.Clique sobre o boto2 > Properties > Action
On Mouse Events ; ( x ) Press
Drag Movie Clip : ( x ) Start Drag Operation ; target : /produto2 ; ( x ) Lock mouse
Beto Marques - Curso de Flash 4.0 On Line
86
to center
Selecione End Drag
On Mouse Events ; ( x ) Release e ( x ) Release Outside
Drag Movie Clip ; ( x ) Stop Drag Operation
27.Window > Library > Options > New Symbol
28.Name : boto3 ; behavior : button
29.Arraste da Library o smbolo produto3
30.Crtl K para centralizar
31.Deixe os estgios over, down e hit vazios
32.Window > Library > Options > New Symbol
33.Name : boto3_mov ; behavior : movie clip
34.Arraste o smbolo boto3 para edio do movieclip
35.Importante : posicionar o boto do lado esquerdo do sinal ( + ) na parte de cima
36.Clique sobre o boto3 > Properties > Action
On Mouse Events ; ( x ) Press
Drag Movie Clip : ( x ) Start Drag Operation ; target : /produto3; ( x ) Lock mouse to
center
Selecione End Drag
On Mouse Events ; ( x ) Release e ( x ) Release Outside
Drag Movie Clip ; ( x ) Stop Drag Operation
57.Volte Cena 1
58.Renomeie o layer de texto
59.Digite : Loja Virtual ; e pinte de azul
60.Digite : Arraste para cesta os botes de camisa que queira comprar ; e pinte de preto
61.Insira um blank keyframe na linha 2 e um frame na linha do tempo 10
CHAT ANIMADO
DICAS FINAIS
</frameset>
Como scanear uma imagem sem perder a resoluo e nitidez usando o Corel
Photo-Paint 8 para ser importada ao Flash
SCREENSAVER
http://www.macsourcery.com
FlashZone - http://www.flashzone.com
Macromania - http://www.users.bigpond.com/xtian/welcomenew.html
Beto Marques - Curso de Flash 4.0 On Line
95
Moock WebDesign Flash - http://colinmoock.iceinc.com/webdesign/flash/index.html
http://rivendell.fortunecity.com/krondor/531/opensource.html
ASSINATURA DIGITAL