Vous êtes sur la page 1sur 37

NDICE EXERCCIO 01 - MOVIMENTEO ENTRE OBJETOS EXERCCIO 02 - MOVIMENTO COM TEXTO EXERCCIO 03 - MOVIMENTO SENTIDO HORRIO EXERCCIO 04 EFEITO

O FADE EXERCCIO 05 ANIMAO COM DOIS OBJETOS ADD GUIDE LAYER ADICIONAR GUIA A CAMADA(MOTION GUIDE) EXERCCIO 06 ADICIONAR GUIA A CAMADA EXERCCIO 07 DANA DAS LETRAS FORMA DE DEFORMAO EXERCCIO 08 - MOVIMENTO DE DEFORMAO EXERCCIO 09 DEFORMAO COM TEXTOS EXERCCIO 10 DEFORMAO COM IMAGENS EXERCCIO 11 DEFORMAO COM AUXILIO DE MARCADORES BOTO SIMPLES EXERCCIO 12 BOTO SIMPLES TRATAMENTO DE IMAGENS COMO TRANSFORMAR UMA IMAGEM BITMAP COMO VETORIAL COMO SIMULAR TRANPARENCIA COMO USAR UMA IMAGEM COM TEXTURA COMO USAR IMAGEM EM 3D MOVIE CLIP EXERCCIO 13 MOVIE CLIP EXERCCIO 14 MOVIE CLIP COM IMAGEM MASK MSCARA EXERCCIO 15 BANNER ANIMADO I EXERCCIO 16 BANNER ANIMADO II EXERCCIO 17 BANNER ANIMADO III EXERCCIO 18 BANNER ANIMADO IV SOM PAINEL DE SOM EXERCCIO 19 SOM EM BOTO EXERCCIO 20 BOTO LIGA/DESLIGA SOM EXERCCIO 21 CENAS USANDO GOTO EXERCCIO 22 HTML COM FRAMES USANDO GETURL PUBLICAO PUBLICAR PAGINA HTML PROPRIEDADES DO ARQUIVO.SWF EXERCCIO 23 - IMAGENS CARREGANDO EXERCCIO 24 IMAGENS CARREGANDO EM PORCENTAGEM EXERCCIO 25 ARQUIVO EM FLASH PARA IMPRESSO EXERCCIO 26 - ARQUIVO EM FLASH COMO SCREENSAVER EXERCCIO 27 - COMO CRIAR GIF ANIMADO EXERCCIO 28 - ACTIONCSRIPT IF FRAME IS LOADED EXERCCIO 29 CONTADOR EXERCCIO 30 CONTADOR/ MOVIE CLIP EXERCCIO 31 AREA RESTRITA EXERCCIO 32 SCROOL AREA EXERCCIO 33 SCROOL AREA/TEXTO EXTERNO EXERCCIO 34 TEXTO E ANIMAES EXERCCIO 35 LOAD VARIABLE

EXERCCIO 01 - MOVIMENTO ENTRE OBJETOS 01. Desenhe uma bola e remova o contorno. 02. Selecione a bola > Insert > Motion Tweening. 03. Abra o objeto criado(Clique duplo sobre o desenho). 04. Selecione a linha de tempo 50 deste layer camada 05. Insert Inserir > Keyframe Chave de Quadro ou F6 06. Mantendo selecionado a linha de tempo 50, mude a pocio da bola 07. Clique com boto direito do mause entre a linha de tempo 1 e 50 > Create Classic Tween. 08. Observe que ser exibido uma seta entre os dois quadros com fundo roxo 09. Salve a animao como exer01.fla 10. Para testar a animao > File Arquivo > Export Movie Exportar Animao ou Ctrl+Enter, isto , automaticamente o arquivo exer01.fla ser criado um arquivo compactado em shockwave exer01.swf 11. Na barra superior clique em scena (Para voltar a cena ); 12. Clique com boto direito do mouse em qualquer parte da rea de trabalho (cena) > Document Properties..(Propriedades do documento). 13. Background Color - Cor de Fundo > escolha uma cor 14. Clique OK 15. Salve a animao > Ctrl+Enter e teste sua animao EXERCCIO 02 - MOVIMENTO COM TEXTO 01. Digite uma palavra 02.Depois segure ctrl + b para desmembrar os texto. 03. Selecione o texto j desmembrado>insert>Motion tween. 04. Selecione a linha de tempo 50 deste layer - camada 05. Insert - Inserir > Keyframe - Chave de Quadro ou F6 06. Mantendo selecionado a linha de tempo 50, mude a posio do texto 07. Clique com boto direito do mouse entre a linha de tempo 1 e 50 > Classic tween. 08. Observe que ser exibido uma seta entre os dois quadros. 09. Salve a animao como exer02.fla 10. Clique na linha de tempo 1 11. Selecione o texto > Modify - Modificar > Transform - Transformar > Scale and Rotate Escala e rotao > Escala: 500 12. Arraste o texto para fora da Cena, na parte superior esquerda. 13. Salve a animao > Ctrl+Enter e teste sua animao. EXERCCIO 03 - MOVIMENTO SENTIDO HORRIO 01. Desenhe uma quadrado com uma linha transversale pinte de uma cor gradiente, em caso de dvida de como criar uma cor gradiente, solicite ajuda de um instrutor. 02. Selecione o quadrado>insert>motion tween. 03. clique duas vezes no quadrado para abrir a edio do motion. 04. Selecione a linha de tempo 50 deste layer - camada 05. Insert - Inserir > Keyframe - Chave de Quadro ou F6 06. Mantendo selecionado a linha de tempo 50, mude a posio da bola 07. Clique com o boto direito do mouse entre a linha de tempo 1 e 50 > Classic Tween. 08. Observe que ser exibido uma seta entre os dois quadros. 09. Salve a animao como exer03.fla

10. Abra o symbol(clique duplo sobre o desenho). 11. clique sobre o cadro da posio 1. 12. Em seguida abra as propriedade no canto direito ou Windows>properties. 13. Na opo Tweening> rotate > CW. 14. Salve e execute o arquivo para ver o resultado da sua animao. EXERCCIO 04 - EFEITO FADE 01. Clique em Frame Rate - Medida do Quadro mude a cor de fundo da animao para preto 02. Digite uma palavra em branco 03. Selecione a palavra > Modify>Conver Symbol ou f8. 04. Ser exibido uma Caixa de Dilogo: Name - Nome: digite texto2 Behavior - Comportamento > (x) Graphic - Grfico 05. Selecione o texto > Modify> Align - Alinhar ou Ctrl+K ou e centralize o texto no meio da rea de trabalho (Cena) 06. Selecione a linha de tempo 50 deste layer - camada 07. Mantendo selecionada a linha de tempo 50 > com o boto direito do mouse sobre o texto > properties>Color Effect. 08. Selecione Alpha > digite 0 (zero). 09. Salve a animao >Com o nome de exer04.fla 10. Ctrl+Enter e teste sua animao. ADD GUIDE LAYER - ADICIONAR GUIA CAMADA Add Guide Layer - Adicionar Guia Camada um efeito que cria os caminhos por onde passar sua animao, mas para que ocorra esse efeito, necessrio criar primeiramente o Motion Tweening - Movimento entre Objetos EXERCCIO 06 - ADICIONAR GUIA CAMADA 01. Desenhe uma bola 02. Selecione a bola > Insert - Inserir > Convert to Symbol - Converter para Smbolo ou F8 03. Ser exibido uma caixa de Dilogo: Name - Nome: digite bola4 Behavior - Comportamento > (x) Graphic - Grfico 04. Selecione a linha de tempo 50 deste layer - camada 05. Insert - Inserir > Keyframe - Chave de Quadro ou F6 06. Mantendo selecionado a linha de tempo 50, mude a posio da bola 07. Clique com o boto direito do mouse entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre Objetos 08. Observe que ser exibido uma seta entre os dois quadros com fundo roxo 09. Salve a animao como exer06.fla 10. Salve a animao > Ctrl+Enter e teste sua animao 11. Uma vez que esteja rodando a animao, devemos adicionar guia camada! 12. Clique Ctrl+F4 e volte Cena Clique no cone Add Guide Layer - Adicionar Guia Camada (folha roxa) 13. Clique no cone Edit Multiple Frame - Editar Mltiplos Quadrados 14. Ser exibido duas guias na linha de tempo

15. Arraste as guias para extremidade da animao, ou seja, uma para linha de tempo 1 e a outra para a linha de tempo 50 16. Ser exibido a bola na posio dos dois quadros! 17. Clique no cone Pencil Tool - Ferramenta Lpis 18. Clique na ferramenta opcional do Lpis > cone Pencil Mode - Modo do Lpis > selecione a opo Smooth - Suavizar 19. Desenhe um traado por onde deseja que passe a bola - Ateno! O traado deve iniciar no meio do smbolo, no caso a bola, no sinal + da linha de tempo 1 e terminar no meio da outra bola na linha de tempo 50 Dicas: - O traado deve ser feito sempre com o Layer Guide - Guia Camada acionado - Nunca faa o traado no Layer - Camada somente, pois no ir funcionar! 20. Desative o cone Edit Multiple Frame - Editar Mltiplos Quadros 21. Salve a animao > Ctrl+Enter e teste sua animao - Center Frame - Centralizar Quadro - Onion Skin - Casca de Cebola - exibe a trajetria por onde o objeto ir passar - Onion Skin Outlines - Contornos da Casca de Cebola - exibe a trajetria somente dos contornos do objeto por onde ir passar - Edit Multiple Frame - Editar Mltiplos Quadros - para criar a trajetria entre os objetos - Modify Onion Markers - Modificar os Marcadores da Cebola EXERCCIO 07 - DANA DAS LETRAS 01. Digite a palavra PAZ em Arial Black, 60 e com espao entre as letras 02. Selecione o texto > Modify - Modificar > Break Apart - Quebrar ou Ctrl+B, ou seja, a palavra PAZ no mais uma texto, e sim um objeto 03. Clique em Paint Bucket Tool - Ferramenta Balde e pinte cada letra com uma cor diferente 04. Selecione a letra P > Insert - Inserir > Convert to Symbol - Converter para Smbolo ou F8 05. Ser exibido uma Caixa de Dilogo: Name - Nome: digite P Behavior - Comportamento > (x) Graphic - Grfico 06. Selecione a letra A > Insert - Inserir > Convert to Symbol - Converter para Smbolo ou F8 07. Ser exibido uma Caixa de Dilogo: Name - Nome: digite A Behavior - Comportamento > (x) Graphic - Grfico 08. Selecione a letra Z > Insert - Inserir > Convert to Symbol - Converter para Smbolo ou F8 09. Ser exibido uma Caixa de Dilogo: Name - Nome: digite Z Behavior - Comportamento > (x) Graphic - Grfico 10. Selecione a linha de tempo 1 > boto direito do mouse > Copy Frame - Copiar Quadro 11. Clique no cone Add Layer - Adicionar Camada (folha branca) 12. Clique na linha de tempo 1 do Layer 2 - Camada 2 > boto direito do mouse > Paste Frame - Colar Quadro 13. Clique no cone Add Layer - Adicionar Camada (folha branca) 14. Clique na linha de tempo 1 do Layer 3 - Camada 3 > boto direito do mouse > Paste Frame - Colar Quadro 15. Concluso: so trs letras e por isto que criamos 3 layers - camadas

16. Selecione a linha de tempo 50 dos Layers - Camadas 1,2 e 3 17. Insert - Inserir > Keyframe - Chave de Quadro ou F6 18. Clique no Layer 3 - Camada 3 duas vezes e renomeie para P 19. Clique no Layer 2 - Camada 2 duas vezes e renomeie para A 20. Clique no Layer 1 - Camada 1 duas vezes e renomeie para Z 21. Com a ferramenta Olho > esconda os Layers - Camadas A e Z 22. Agora vamos trabalhar somente com a Camada P! 23. Selecione a linha de tempo 1 e delete as letras A e Z e mude a posio da letra P 24. Selecione a linha de tempo 50 e delete as letras A e Z e deixe a letra P como est 25. Com a ferramenta Olho > esconda os Layers - Camadas P e Z 26. Agora vamos trabalhar somente com a Camada A! 27. Selecione a linha de tempo 1 e delete as letras P e Z e mude a posio da letra A 28. Selecione a linha de tempo 50 e delete as letras P e Z e deixe a letra A como est 29. Com a ferramenta Olho > esconda os Layers - Camadas P e A 30. Agora vamos trabalhar somente com a Camada Z! 31. Selecione a linha de tempo 1 e delete as letras P e A e mude a posio da letra Z 32. Selecione a linha de tempo 50 e delete as letras P e A e deixe a letra Z como est 33. Salve a animao como exer07.fla 34. Clique com boto direito do mouse na Camada P entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre Objetos 35. Clique com boto direito do mouse na Camada A entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre Objetos 36. Clique com boto direito do mouse na Camada Z entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre Objetos 37. Salve a animao > Ctrl+Enter e teste sua animao 38. Clique Alt+F4 e volta Cena 39. Agora vamos fazer a Dana das Letras! 40. Clique na ferramenta Olho e esconda as camadas A e Z 41. Selecione a camada P 42. Clique no cone Add Guide Layer - Adicionar Guia Camada (folha roxa) 43. Clique no cone Edit Multiple Frame - Editar Mltiplos Quadros 44. Ser exibido duas guias na linha de tempo 45. Arraste as guias para extremidade da animao, ou seja, uma para linha de tempo 1 e a outra para linha de tempo 50 46. Ser exibido a letra P na posio dos dois quadros 47. Clique no cone Pencil Tool - Ferramenta Lpis 48. Clique na ferramenta opcional do Lpis > cone Pencil Mode - Modo do Lpis > selecione a opo Smooth - Suavizar 49. Clique Ctrl+Enter e teste sua animao! 50. Clique Alt+F4 e volte Cena 51. Clique na ferramenta Olho e esconda as camadas P e Z 52. Clique na ferramenta Olho e esconda a trajetria da letra P 53. Selecione a camada A 54. Faa o mesmo procedimento mencionados nos itens 42 48 com a camada A 55. Clique Ctrl+Enter e teste sua animao! 56. Clique Alt+F4 e volte Cena 57. Clique na ferramenta Olho e esconda as camadas P e A 58. Clique na ferramenta Olho e esconda a trajetria da letra A 59. Selecione a camada Z 60. Faa o mesmo procedimento mencionados nos itens 42 48 com a camada Z

61. Clique na linha de tempo 50 da camada P > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > Stop 62. Clique Ctrl+Enter e teste sua animao! - Quando se trabalha com vrios layers - camadas e queira editar somente uma camada, no caso, a camada P, clique nas outras camadas na coluna do olho (veja imagem ao lado) - Se clicar no olho diretamente > esconder todas as camadas - Sempre que terminar uma animao recomendvel, clicar diretamente no cadeado para trancar as camadas e evitar problemas futuros FORMA DE DEFORMAO Shape ou Forma de Deformao, conhecido tambm como morphing, cria deformaes entre objetos, mas ateno: os objetos no podem ser smbolos! - Para controlar melhor a deformao usado Add Shape Hints - Adicionar Marcadores na Forma EXERCCIO 08 - MOVIMENTO DE DEFORMAO 01. Desenhe um quadrado sem borda (Imagem 01) 02. Selecione a linha de tempo 10 deste layer - cama da 03. Insert - Inserir > Keyframe - Chave de Quadro ou F6 04. Com a ferramenta de Seta modifique o formato do quadrado, mas sempre na rea do formato original (Imagem 02) 05. Selecione a linha de tempo 20 deste layer - camada 06. Insert - Inserir > Keyframe - Chave de Quadro ou F6 07. Com a ferramenta de Seta modifique o formato do quadrado, mas sempre na rea do formato original (Imagem 03) 08. Selecione a linha de tempo 30 deste layer - camada 09. Insert - Inserir > Keyframe - Chave de Quadro ou F6 10. Com a ferramenta de Seta modifique o formato do quadrado, mas sempre na rea do formato original (Imagem 04) 11. Selecione a linha de tempo 40 deste layer - camada 12. Insert - Inserir > Keyframe - Chave de Quadro ou F6 13. Com a ferramenta de Seta modifique o formato do quadrado, mas sempre na rea do formato original (Imagem 05) 14. Window - Janela > Panels - Painis > Frame - Quadro ou Ctrl+F 15. Clique entre a linha de tempo 1 e 10 16. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Angular - Distributive - Distributivo - os objetos dos quadros do meio da animao ficam irregulares e suaves - Angular - os objetos dos quadros do meio da animao mantm as linhas e os cantos 17. Clique entre a linha de tempo 11 e 20 18. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Angular

19. Clique entre a linha de tempo 21 e 30 20. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Angular 21. Clique entre a linha de tempo 31 e 40 22. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Angular 23. Observe que ser exibido uma seta entre os quadros com fundo verde 24. Salve a animao como exer08.fla 25. Salve a animao > Ctrl+Enter e teste sua animao

EXERCCIO 09 - DEFORMAO COM TEXTOS 01. Digite a palavra FLASH em arial black, tamanho 48 e em azul 02. Selecione o texto e Modify - Modificar > Break Apart - Quebrar ou Ctrl+B, logo o texto ser agora uma imagem! Selecione a linha de tempo 50 deste layer - camada 03. Insert - Inserir > Keyframe - Chave de Quadro ou F6 04. Digite a palavra ANIMAO em arial black, tamanho 48, vermelho e em outra posio 05. Selecione ANIMAO e Modify - Modificar > Break Apart - Quebrar ou Ctrl+B, logo o texto ser agora uma imagem! 06. Mantendo selecionado a linha de tempo 50 07. Selecione a palavra FLASH e delete 08. Window - Janela > Panels - Painis > Frame - Quadro ou Ctrl+F 09. Clique entre a linha de tempo 1 e 50 10. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 11. Observe que ser exibido uma seta entre os quadros com fundo verde 12. Salve a animao como exer09.fla 13. Salve a animao > Ctrl+Enter e teste sua animao EXERCCIO 10 - DEFORMAO COM IMAGEM 01. File - Arquivo > Import - Importar > importe uma imagem > (Imagem 01) 02. Selecione a imagem > Modify - Modificar > Break Apart - Quebrar ou Ctrl+B 03. Selecione a linha de tempo 15 deste layer - camada 04. Insert - Inserir > Keyframe - Chave de Quadro ou F6 05. Com a ferramenta Seta modifique o formato da imagem, mas sempre na rea do formato da imagem original (Imagem 02) 06. Selecione a linha de tempo 30 deste layer - camada 07. Insert - Inserir > Keyframe - Chave de Quadro ou F6 08. Com a ferramenta Seta modifique o formato da imagem, mas sempre na rea do formato da imagem original (Imagem 03) 09. Selecione a linha de tempo 45 deste layer - camada

10. Insert - Inserir > Keyframe - Chave de Quadro ou F6 11. Com a ferramenta Seta modifique o formato da imagem, mas sempre na rea do formato da imagem original (Imagem 04) 12. Window - Janela > Panels - Painis > Frame - Quadro ou Ctrl+F 13. Clique entre a linha de tempo 1 e 15 14. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 15. Clique entre a linha de tempo 16 e 30 16. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 17. Clique entre a linha de tempo 31 e 45 18. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 19. Observe que ser exibido uma seta entre os quadros com fundo verde 20. Salve a animao como exer10.fla 21. Salve a animao > Ctrl+Enter e teste sua animao EXERCCIO 11 - DEFORMAO COM AUXLIO DE MARCADORES 01. Desenhe um quadrado sem borda 02. Selecione a linha de tempo 15 deste layer - camada 03. Insert - Inserir > Keyframe - Chave de Quadro ou F6 04. Selecione a linha de tempo 30 deste layer - camada 05. Insert - Inserir > Keyframe - Chave de Quadro ou F6 06. Selecione a linha de tempo 45 deste layer - camada 07. Insert - Inserir > Keyframe - Chave de Quadro ou F6 08. Selecione a linha de tempo 15 09. Selecione a ferramenta Im 10. Selecione a ferramenta Line Tool - Ferramenta Linha 11. Desenhe um tringulo dentro do quadrado 12. Pinte o tringulo de outra cor 13. Selecione a parte fora do tringulo e delete 14. Delete tambm as bordas do tringulo 15. Selecione a linha de tempo 30 16. Mantenha selecionada a ferramenta Im 17. Selecione a ferramenta Line Tool - Ferramenta Linha 18. Desenhe um losngo dentro do quadrado 19. Pinte o losngo de outra cor 20. Selecione a parte de fora do losngo e delete 21. Delete tambm as bordas do losngo 22. Selecione a linha de tempo 45 23. Desative a ferramenta Im 24. Selecione a ferramenta Oval Tool - Ferramenta Oval 25. Desenhe uma bola dentro do losngo 26. Pinte a bola de outra cor

27. Selecione a parte fora da bola e delete 28. Delete tambm as bordas da bola 29. Window - Janela > Panels - Painis > Frame - Quadro ou Ctrl+F 30. Clique entre a linha de tempo 1 e 15 31. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 32. Clique entre a linha de tempo 16 e 30 33. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 34. Clique entre a linha de tempo 31 e 15 35. No painel Frame - Quadro - Tweening - Movimento > Shape - Forma - Easing - Acelerao > deixe como est! - Blend Type - Tipos de Mistura: (x) Distributive - Distributivo 36. Observe que ser exibido uma seta entre os quadros com fundo verde 37. Salve a animao como exer11.fla 38. Salve a animao > Ctrl+Enter e teste sua animao 39. Clique Alt+F4 e volte Cena 40. Agora vamos usar os marcadores para auxiliar a deformao! 41. Selecione a linha de tempo 1 42. Selecione o quadrado 43. Modify - Modificar > Transform - Transformar > Add Shape Hints - Adicionar Marcadores Forma 44. Ser exibido uma bola vermelha com o marcador A Dicas: - Sempre iniciar com o marcador A na parte superior esquerda do objeto - Os outros marcadores devem ser inseridos no sentido horrio - O Flash permite que voc possa inserir at 26 marcadores 45. Arraste o marcador A para uma extremidade do quadrado (na parte superior esquerda) 46. Clique sobre o marcador A > boto direito do mouse > Add Hints - Adicionar Marcadores 47. Ser exibido uma bola vermelha com o marcador B 48. Arraste o marcador B para uma extremidade do quadrado (na parte superior direita) 49. Repita o mesmo processo e insira os marcadores C e D 50. Selecione a linha de tempo 15 51. Ser exibido o marcador D no meio do polgono 52. Arraste para extremidade do tringulo os marcadores 53. Selecione a linha de tempo 30 54. Selecione o losngo 55. Repita o mesmo procedimento mencionado nos itens 43 49 56. Selecione a linha de tempo 45 57. Selecione a bola 58. Arraste para extremidade da bola os marcadores 59. Salve a animao 60. Salve a animao > Ctrl+Enter e teste sua animao

EXERCCIO 12 BOTO SIMPLES Geralmente o boto tem quatro estgios: - Up - como o boto aparece na sua forma inicial - Over - como o boto aparece quando o mouse passa por cima do boto - Down - como o boto aparece quando voc clica no boto - Hit - define a rea "clicvel" do boto, ou seja, a rea em que ele acionado Existe duas formas de boto: - Track as Button - Boto um boto independe ou seja as aes nele inserida no depende de outros botes - Track as Menu Item - Boto Item de Menu um boto dependente, ou seja, um submenu de um boto principal Em todos os botes so usados a ActionScript OnMouseEvents EXERCCIO 12 - BOTO SIMPLES 01. At agora voc criava smbolos, selecionando o objeto e apertando F8 02. Vamos criar um smbolo agora de outra forma, que a mais recomendvel! 03. Window - Janela > Library - Biblioteca ou Ctrl+L 04. Options - Opes > New Symbol - Novo Smbolo 05. Ser exibido uma Caixa de Dilogo: Name - Nome: digite botao (sem acento) Behavior - Comportamento > (x) Button - Boto 06. Observe que ser aberta uma rea para edio do boto com os quatro estgios: Up, Over, Down e Hit 07. Desenhe uma bola sem bordas com cores gradientes em Linear, sendo que uma das cores seja a preta: exemplo azul e preto! (Imagem 1) 08. Selecione a bola > Ctrl+K e centralize a bola no meio do sinal + 09. Selecione a bola novamente > Ctrl+D para duplicar 10. Arraste a cpia da bola para fora 11. Selecione a cpia da bola > Modify - Modificar > Transform - Transformar > Scale and Rotate - Escala e Rotao > Escala: 90 Rotao: 180 (Imagem 2) 12. Selecione a cpia da bola > Ctrl+K e centralize a cpia da bola no meio do sinal +, ou seja por cima da bola original (Imagem 3) 13. Digite sobre o boto: Clique (em cor branca) 14. Selecione o texto > Ctrl+K e centralize a bola no meio do sinal + 15. Selecione a linha de tempo o estgio Over > F6 16. Selecione a linha de tempo o estgio Down > F6 17. Selecione a linha de tempo o estgio Hit > F6 18. Selecione a linha de tempo o estgio Over > selecione somente o texto e mude a cor do texto 19. Selecione a linha de tempo o estgio Down > selecione somente o texto e mude a cor do texto 20. Selecione a linha de tempo o estgio Over > selecione todo boto 21. Modify - Modificar > Transform - Transformar > Scale and Rotate - Escala e Rotao > Escala: 120 Rotao: 0 22. Selecione a linha de tempo o estgio Down > selecione todo boto 23. Modify - Modificar > Transform - Transformar > Scale and Rotate - Escala e Rotao > Escala: 80 Rotao: 0 24. Clique no cone Scene - Cena e volte Cena 25. Selecione o boto na Biblioteca e arraste para rea da trabalho (Cena)

26. Salve a animao como exer12.htm > Ctrl+Enter e teste sua animao (No mdulo sobre Botes Avanados, vamos aprender como inserir aes nos botes e como criar botes e submenus) TRATAMENTO DE IMAGENS Para inserir uma imagem em sua animao: 01. File - Arquivo > Import - Importar 02. Selecione a imagem e importe para seu arquivo 03. Window - Janela > Library - Biblioteca e observe que a imagem est armazenada na biblioteca - As extenses de imagem aceitas no Flash so: .bmp, .gif, .jpg e .png - A extenso mais recomendvel a .png com imagem de resoluo 72 150 dpi - Quando se importa uma gif animada para o Flash, ele aceita toda a sequncia da animao e exibe todos os quadros - frames - Imagem transparente em .gif importadas para o Flash tambm so aceitas - Todas as vezes que vamos testar uma animao no Flash com uma imagem, ou seja, o arquivo.swf; independentemente da extenso original, a extenso da imagem se tornar .jpg COMO TRANSFORMAR UMA IMAGEM BITMAP EM VETORIAL 01. Todas as extenses mencionadas acima so de uma imagem Bitmap 02. Bitmap uma imagem formada em pixels 03. Vetorial uma imagem formada por clculos matemticos no computador 04. Uma vez importada a imagem Bitmap para a animao 05. Selecione a imagem 06. Modify - Modificar > Trace Bitmap - Traar Bitmap 07. Ser exibido uma caixa de dilogo: - Color Threshold - Percentual de Cores - para controlar cores de tons semelhantes e uma nica cor. Default do Flash 10 e quanto maior for dado para este controle, menor ser o controle das cores - Minimum Area - rea Mnima - determina quantidade de pixels em torno de um ponto, ou seja, quanto menor valor, menor ser os detalhes que esteja trabalhando com uma imagem - Curve Fit - Ajuste da Curva - determina as curvas da imagem que pode ser: Pixels, Very Tight - Muito Apertado, Tight - Apertado, Normal, Smooth - Suave, Very Smooth Muito Suave - Corner Threshold - Percentual do Canto - determina os cantos das curvas da imagem que pode ser: Many Corners - Muitos Cantos, Normal e Few Corners - Poucos Cantos COMO SIMULAR TRANSPARNCIA 01. Uma vez importada a imagem para o Flash 02. Selecione a imagem 03. Modify - Modificar > Break Apart - Quebrar ou Ctrl+B 04. Selecione a ferramenta Lasso 05. Nas ferramentas opcionais do Lasso > selecione Magic Wand Properties Propriedades da Varinha Mgica > Default do Flash 10 06. Clique em Magic Wand - Varinha Mgica 07. Selecione as cores semelhantes que deseja excluir da imagem

08. Delete COMO USAR UMA IMAGEM COM TEXTURA 01. Uma vez importada a imagem para o Flash 02. Selecione a imagem 03. Modify - Modificar > Break Apart - Quebrar ou Ctrl+B 04. Selecione a ferramenta Dropper - Conta Gotas 05. Clique na imagem e a textura ser exibida na ferramenta Balde Desenhe uma bola 06. Observe que a textura foi aplicada no preenchimento da bola COMO USAR IMAGEM EM 3D Para usar Imagens em 3D (Tridimensionais) seja esttica ou animada existem alguns programas na qual voc pode criar suas imagens em 3D e importar para Flash: - Aviel http://www.aviel.com - Illustrate que um plugin para 3DS Max 2.5 que renderiza a sua animao 3D diretamente em swf em grficos vetoriais. http://www.davidgould.com - Swift 3D http://www.swift3d.com - Vecta 3D http://www.vecta3d.com Dica: - No CD do Flash 5.0 vem um programa chamado Swish na verso demo que cria Efeitos para Textos no Flash - O programa custa US$30 http://www.swishzone.com MOVIE CLIP Movie Clip um trecho de animao criado na edio do Smbolo e inserido na ria de trabalho - Cena EXERCCIO 13 - MOVIE CLIP 01. Window - Janela > Library - Biblioteca ou Ctrl+L 02. Options - Opes > New Symbol - Novo Smbolo 03. Ser exibido uma Caixa de Dilogo: Name - Nome: digite bola Behavior - Comportamento > (x) Graphic - Grfico (que ser o modelo original para o Movie Clip) 04. Desenhe uma bola e pinte de cor gradiente 05. Selecione a bola > Ctrl+K para centralizar a bola no meio do sinal + na edio do smbolo 06. Options - Opes > New Symbol - Novo Smbolo 07. Ser exibido uma Caixa de Dilogo: Name - Nome: digite bola_movie Behavior - Comportamento > (x) Movie Clip 08. Arraste da biblioteca a bola grfica para edio do movie clip 09. Selecione a bola > Ctrl+K para centralizar a bola no meio do sinal 10. Selecione a linha de tempo 20 na edio do movie clip > F6 11. Window - Janela > Panels - Painis > Frame - Quadro ou Ctrl+F

12. Clique entre a linha de tempo 1 20 13. No painel do Quadro: Tweening - Entre Objetos > Motion - Movimento Counterwise - Sentido Horrio Times - Vezes > digite 4 14. Clique no cone Scene - Cena e volte cena 15. Selecione na biblioteca o smbolo bola_movie e arraste para Cena 16. Selecione a linha de tempo 40 da Cena > F5 (inserir frame - quadro) 17. Salve a animao como exer13.htm > Ctrl+Enter e teste sua animao EXERCCIO 14 - MOVIE CLIP COM IMAGEM 01. File - Arquivo > Import - Importar e importe a imagem cena1.png\ que seguem, anexo a este mdulo 02. Selecione a imagem 03. Modify - Modificar > Break Apart - Quebrar ou Ctrl+B 04. Selecione a ferramenta Lasso 05. Nas ferramentas opcionais do Lasso > selecione Magic Wand Properties - Propriedades da Varinha Mgica > 10 06. Clique em Magic Wand - Varinha Mgica 07. Clicando na tela do celular 08. Mantendo selecionada a tela do celular > F8 > smbolo > digite: tela (x) graphic - grfico 09. Clique OK 10. Delete a tela do celular na Cena 11. Window - Janela > Library - Biblioteca ou Ctrl+L 12. Options - Opes > New Symbol - Novo Smbolo 13. Ser exibido uma Caixa de Dilogo: Name - Nome: digite tela_movie Behavior - Comportamento > (x) Movie Clip 14. Selecione a biblioteca o smbolo tela e arraste para a edio da tela_movie 15. Selecione a tela > Ctrl+K para centralizar no meio do sinal + na edio do smbolo 16. Selecione a linha de tempo 2 na edio do movie clip > F6 17. Selecione a linha de tempo 3 na edio do movie clip > F6 18. Selecione a linha de tempo 4 na edio do movie clip > F6 19. Selecione a linha de tempo 2 na edio do movie clip > selecione o desenho da tela > boto direito do mouse > Panels - Painis - Effect - Efeito > Alpha=50% 20. Selecione a linha de tempo 3 na edio do movie clip > selecione o desenho da tela > boto direito do mouse > Panels - Painis - Effect - Efeito > Alpha = 75% 21. Selecione a linha de tempo 4 na edio do movie clip > selecione o desenho da tela > boto direito do mouse > Panels - Painis - Effect - Efeito > Alpha = 0% 22. Clique no cone Scene - Cena e volte Cena 23. Selecione a biblioteca a tela_movie e arraste exatamente para sua posio original na imagem celular (use as setinha do teclado para posicionar corretamente) 24. Clique no rodap da rea de trabalho a porcentagem da tela de 100% para 400% 25. Selecione a ferramenta Lasso 26. Nas ferramentas opcionais do Lasso > Selecione Magic Wand Propertis Propriedades da Varinha Mgica > 10 27. Clique em Magic Wand - Varinha Mgica 28. Clique na lente da cmera digital 29. Mantendo selecionada a tela celular > F8 > smbolo > digite: lente (x) graphic - grfico

30. Clique OK 31. Delete a lente da cmera digital na Cena 32. Windows - Janela > Library - Biblioteca ou Ctrl+L 33. Options - Opes > New Sybol - Novo Smbolo 34. Ser exibido uma Caixa de Dilogo: Name - Nome: digite lente_movie Behavior - Comportamento > (x) Movie Clip 35. Selecione da biblioteca o smbolo lente e arraste para a edio da lente_movie 36. Selecione a lente > Ctrl+K para centralizar no meio do sinal + na edio do smbolo 37. Selecione a linha de tempo 2 na edio do movie clip > F6 38. Selecione a linha de tempo 3 na edio do movie clip > f6 39. Selecione a linha de tempo 4 na edio do movie clip > f6 40. Clique na rea de trabalho a porcentagem da tela de 100% para 400% 41. Selecione a linha de tempo na edio do movie clip > selecione o desenho da lente > boto direito do mouse > Panels - Painis - Effect - Efeito > Tint - Tinta > selecione a cor vermelha 42. Selecione a linha de tempo 2 na edio do movie clip > selecione o desenho da lente > boto direito do mouse > Panels - Painis - Effect - Efeito > Tint - Tinta > selecione a cor amarela 43. Selecione a linha de tempo3 na edio do movie clip > selecione o desenho da lente > boto direito do mouse > Panels - Painis - Effect - Efeito > Tint - Tinta > escolha cor de rosa 45. Clique no cone Scene - Cena e volte Cena 46. Clique no rodap da rea de trabalho a porcentagem da tela de 100% para 400% 47. Selecione da biblioteca a lente_movie e arreste exatamente para sua posio original na imagem da cmera digital (use a setinha do teclado para posicionar corretamente) 48. Para que a imagem seja exibida somente do tamanho que foi criada, vamos inserir uma ao FSCommand! 49. Selecione a linha de tempo 1 da Camada 1 > boto direito do mouse > Action - Aes > Basic Actions - Aes Bsicas > Duplo clique em FSCommand digite: Command Comando : allowscale Arguments - Argumentos: false 50. Salve a animao como exer14.htm > Ctrl+Enter e teste sua animao MASK - MSCARA Mask ou Mscara so camadas que escondem parte da animao EXERCCIO 15 - BANNER ANIMADO I 01. Clique em 12.0 fps e coloque as dimenses de animao: 300x40 e a cor de fundo (background) em azul escuro 02. Clique OK 03. Salve a animao como exer15.fla 04. Digite: BANNER ANIMADO I em arial black, 26 e em laranja 05. Selecione o texto > Ctrl+K e centralize o texto na rea de trabalho 06. Selecione a linha de tempo desta camada > boto direito do mouse > Copy Frames Copiar Quadros 07. Clique na folha branca a baixo das camadas e insira uma nova camada(camada2) 08. Selecione a linha de tempo 1 da Camada 2 > boto direito do mouse > Paste Frames - Colar Quadros

09. Esconda a Camada 1 10. Troque a cor do texto da Camada 2 para amarelo 11. Selecione a linha de tempo numero 50 da camada 1 > F5 (Inserir um Frame Quadro), repita para a camada 2 12. Clique na folha branca abaixo das camadas e insira uma nova camada (Camada3) 13. Posicione a Camada 3 acima de todas as Camadas 14. Selecione a linha de tempo 1 da Camada 3 e desenhe uma bola sobre a letra B da palavra BANNER 15. Esconda as camadas 1 e 2 16. Selecione a bola > F8 > smbolo grfico 17. Exiba as camadas 1 e 2 18. Selecione a bola e arraste para fora( esquerda) da palavra BANNER 19. Selecione a linha de tempo 50 da Camada 3 > F6 (Keyframe - Quadro de Chave) 20. Posicione a bola aps a palavra ANIMADO I 21. Clique com boto direito do mouse entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimentos entre Objetos 22. Clique com o boto direito do mouse sobre a camada 3 > Mask - Mscara 23. Para que o banner seja exibido somente do tamanho que foi criado, vamos inserir uma ao FSCommand Na caixa de parmetros digite: Command - Comando: Allowscale Argumentes Argumentos: False 25. Observe que ser exibido um a (de ao) na linha de tempo 1 26. Salve a animao > Ctrl+Enter e teste sua animao Dicas: *Quando se aplica uma mscara, o Flash insere automaticamente o cadeado entre duas camadas e sempre a mscara ser aplicada na camada da parte de cima sob a camada da parte de baixo *Caso deseja reeditar, voc deve destrancar as camadas e assim que concludo a edio, deve-se trancar novamente as camadas EXERCCIO 16 - BANNER ANIMADO II 01. Clique em 12.0 fps e coloque as dimenses da animao: 300 x 40 e a cor de fundo (background) em azul claro 02. Clique OK 03. Salve sua animao como exer16.fla 04. Digite: BANNER ANIMADO II em arial black, 26 e em preto > d Enter digite TESTANDO 1 > d Enter digite TESTANDO 2 > d Enter digite TESTANDO 3 > d Enter digite TESTANDO 4 05. Selecione o texto > F8 > smbolo grfico 06. Selecione a linha de tempo 100 Camadas 1 > F6 (Keyframe - Quadro de Chave) 07. Clique na folha branca a baixo das camadas e insira uma nova camada(Camada 6) 08. Esconda a camada 1 09. Desenhe na camada 2 um retngulo do tamanho da rea de trabalho 10. Esconda camada 2 11. Exiba a camada 1 > selecione a linha de tempo 100 12. Mude a posio do texto para fora na parte inferior rea de trabalho 13. Selecione a linha de tempo 100 14. Mude a posio do texto para fora na parte superior da rea de trabalho

15. Clique com o boto direito do mouse entra a linha de tempo 1 e 100 > Create Motion Tweening - Criar Movimento entre Objetos 16. Clique com o boto direito do mouse sobre a Camada 2 > Mask - Mscara 17. Para que o banner seja exibido somente do tamanho que foi criado, vamos inserir uma ao FSCommand! 18. Selecione a linha de tempo 1 da camada 2 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em FSCommand digite: Command - Comando: allowscale Arguments - Argumentos: false 19. Salve a animaes > Ctrl+Enter e teste sua animao

EXERCCIO 17 - BANNER ANIMADO III 01. Clique em 12.0 fps e coloque as dimenses da animao: 200 x 150 e a cor de fundo(backgrond) em branco 02. Clique OK 03. Salve sua animao como exer17.fla 04. File - Arquivo > Import - Importar e importe a imagem ipanema.jpg que segure anexo a este mdulo 05. Selecione a imagem > F8 > smbolo grfico 06. Posicione a imagem no canto superior esquerda, observe que parte da imagem ficar fora da rea de trabalho 07. Selecione a linha de tempo 50 da camada 1 > F6 (Keyframe - Quadro de Chave) 08. Selecione a imagem > Modify - Modificar > Transform - Transformar Scale and Rotate - Escala e rotao > Escala: 60 09. Posicione a imagem no meio da rea de trabalho 10. Clique com o boto direito do mouse entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre objetos 11. Clique na Folha Branca abaixo das camadas e insira uma nova camada (camada 2) 12. Esconda a Camada 1 13. Desenhe a camada 2 um retngulo do tamanho da rea de trabalho 14. Clique com o boto direito do mouse sobre a camada 2 > Mask Mscara 15. Para que o banner seja exibido somente do tamanho em que foi criado, vamos inserir uma ao FSCommand! 16. Selecione a linha de tempo 1 da camada 2 > boto direito do mouse > Action - Aes > Basic Actions - Aes Bsicas > duplo clique em FSCommand digite: Command Comando: allowscale Arguments - Argumentos : false 17. Salve a animao > Ctrl+Enter e teste sua animao EXERCCIO 18 - BANNER ANIMADO IV 01. Clique em 12.0 fps e coloque as dimenses da animao: 300 x 40 e a cor de fundo(background) em branco 02. Clique em OK 03. Salve sua animao como exer18.fla 04. Desenhe um retngulo em cinza claro que ocupe a rea de trabalho 05. Digite: BANNER ANIMADO IV em arial black, 24 e em preto 06. Selecione o texto > Ctrl+K e centralize o texto na rea de trabalho

07. Selecione a linha de tempo 50 > F5 (inserir um Frame - Quadro) 08. Clique na folha a branco a baixo das camadas e insira uma nova camada (camada 2) 09. Selecione a linha de tempo 1 da camada 2 e desenhe uma bola sobre a letra B da palavra BANNER 10. Esconda a camada 1 11. Selecione a bola > F8 > smbolo grfico 12. Exiba as camadas 1 e 2 13. Selecione a bola e arraste para fora( esquerda) da palavra BANNER 14. Selecione a linha de tempos 50 da camada 2 > F6(Keyframe- Quadros de Chaves) 15. Posicione a bola aps a palavra ANIMADO IV 16. Clique com o boto direito do mouse entre a linha de tempo 1 e 50 > Create Motion Tweening - Criar Movimento entre Objetos 17. Clique com o boto direito do mouse sobre a camada 2 > Masck - Mscara 18. Para que o banner seja exibido somente do tamanho que foi criado, vamos inserir uma ao FSCommand! 19. Selecione a linha de tempo 1 da Camada 2 > boto direito do mouse > Action - Aes > Basic Actions - Aes Bsicas > duplo clique em FSCommand. Na caixa de parmetros digite: Command - Comando: allowscale Arguments - Argumentos: false 20. Clique em 12.0 fps e troque a cor de fundo(backgroud) para preto 21. Salve a animao > Ctrl+Enter e teste sua animao SOM Os sons podem ser inseridos em botes, na linha de tempo, independentemente da animao, mas um recurso que se deve ter cuidado, pois aumenta consideravelmente o tamanho do arquivo. As extenses aceitas de som so .wav e o mp3 MPEG (Picture Experts Group), mais conhecido como 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 WinAmp 2.10 e o Microsoft Media Player 4.0 que vem junto com o Windows 98. O Winamp 2.10(shareware) considerado o melhor player, pois tem mecanismo que transforma um som wav em compresso MP3. http://www.winnamp.com *Para transformar um som de wav para MP3 01. Abra o Winamp 2.10 02. Menu > Options 03. Preference > Plug-ins 04. Output > Nullsoft Disk Writer 05. Clique em configure > e selecione onde ir armazenar o arquivo.wav Outro programa para Som o KillerSond que vem no CD do Flash 5 uma verso demo http://www.killersound.com *Como inserir um som no Flash: 01. File - Arquivo > Import - Importar 02. Importe seu arquivo de som.wav ou mp3 03. Windows - Janela > Library - Biblioteca - observe que o arquivo do som est na biblioteca

04. Selecione o som na biblioteca e arraste para sua animao 05. Uma vez na animao > ser exibido na linha de tempo uns riscados em azul, isto , neste quadro h um som na animao PAINEL DO SOM 01. Clique quadro na linha de tempo onde foi inserido o som 02. Clique com o boto direito do mouse > Panels - Painis > Sound - Som 03. Ser exibido o Painel do Som 04. Neste painel voc poder fazer as configuraes e efeitos que desejar: - Sound - Som > nome do arquivo do Som - Effect - Efeitos - Synchronize - Sincronizar - Loops - Quantas vezes ir rodar o som. - Edit Envelope - Editar Envelope *Effect - Efeitos None - Nenhum efeito Left chanel - Canal esquerdo - o som sai na caixa de som da esquerda Right chanel - Canal direito - o som sai na caixa de som da direita Fade Left to Right - Esquerda e desaparece na direita - o som comea na caixa de som esquerda e termina na direita Fade Right to Left - Direita e desaparece na esquerda - o som comea na caixa de som direita e termina na esquerda Fade In - Aumentar som - o som vai aumentando aos poucos Fade Out - Diminuir som - o som vai diminuindo aos poucos Custom - Personalizar o efeito *Synchronize - Sincronizar Event - Evento - o som toca at que a animao pare de rodar Start - Iniciar som Stop - Parar som Stream - Corrente - o som toca at terminar, mesmo que a animao no esteja mais rodando *Edi Evelope - Editar envelopes - para mixar som, fazendo as configuraes personalizadas EXERCCIO 19 - SOM EM BOTO 01. Windows - Janela > Library - Biblioteca ou Ctrl+L 02. Option - Opes > New Symbol - Novo Smbolo 03. Ser exibido uma Caixa de Dialogo: Name - Nome : digite boto (sem acento) Behavior - Comportamento > (x) Button - Boto 04. Desenhe o boto > Ctrl+K para centralizar no meio do sinal + na edio do smbolo 05. Insira Keyframe - Chave de quadros > F6 nos estgios Over, Down e Hit 06. Os sons so inseridos somente nos estgios Over e Down 07. Selecione o Estgio Over 08. File - Arquivo > Import - Importar e importe um som neste exemplo vamos aproveitar os sons que vem no Flash 5

09. Windows - Janela > Common Libraries - Bibliotecas comuns Sound - Som 10. Selecione um som e arraste para cima do boto 11. Selecione o estgio Down 12. Selecione outro som e arraste para cima do boto 13. Clique no cone Scene - Cena e volte Cena 14. Selecione o boto na Biblioteca e arraste para rea de trabalho(Cena) 15. Salve a animao como exer19.htm > Ctrl+Enter e teste sua animao EXERCCIO 20 - BOTO LIGA/DELIGA SOM 01. Windows - Janela > Library - Biblioteca ou Ctrl+L 02. Option - Opes > New Symbol - Novo Smbolo 03. Ser exibido uma Caixa de Dilogo: Name - Nome: digite boto(sem acento) Beharvior - Comportamento > (x) Button - Boto 04. Selecione o boto > Ctrl+K para centralizar no meio do sinal + mas na edio do smbolo 05. Insira Keyframe - Chave de Quadro > F6 nos estgios Over, Down e Hit 06. Option - Opes > New Symbol - Novo Smbolo 07. Ser exibido uma Caixa de Dilogo: Name - Nome: digite botao_liga_desliga(sem acento) Behavior - Comportamento > (x) Movie Clip 08. Arraste da biblioteca o smbolo boto para a edio do boto liga/desliga 09. Selecione o boto > Ctrl+K para centralizar no meio do sinal + na edio do smbolo 10. Insira Keyframe - Chave de Quadro > F7 na linha do tempo 10 e 20 11. Renomeie o layer para boto 12. Selecione a linha do tempo 1 > boto direito do mouse > Action - Ao > Stop 13. Selecione a linha do tempo 10 > boto direito do mouse > Action - Ao > Stop 14. Selecione a linha do tempo 1 > boto direito > Panels - Painis > Frame - Quadro > Label - Rtulo > digite liga 15. Selecione a linha do tempo 10 > boto direito > Panels - Painis > Frame - Quadro > Label - Rtulo > digite desliga 16. Observe que ser exibido duas bandeirinhas vermelhas marcando os rtulos: liga e desliga 17. Selecione a linha do tempo 1 > clique sobre o boto > Action - Ao > On Mouse Events (x) Press Stop All Sounds Go to > Type - Tipo > Frame label - Quadro Rtulo > Frame - Quadro > digite liga()Go to and Play(deixe desmarcado) ficando Go to and Stop 19. Insira um layer - camada abaixo e renomeie som 20. Insira um Blank Keyframe - Cave de Quadro em Branco > F7 > na linha de tempo 10 e 20 21. Selecione a linha de tempo 1 do quadro som 22. File - Arquivo > Import - Importar um som com extenso .wav ou .mp3 23. Observe que quando se importa um som para o Flash, o som vai para Library Biblioteca > selecione o som da biblioteca e arraste para o boto 24. Selecione a linha de tempo 1 do layer som > Panels - Painis > Sound - Som Effect - Efeito > None - Nenhum Synchronize - Sincronizao > Event Loops digite 500 25. Volte Cena 1

26. Renomeie o layer para boto_liga_desliga 27. Arraste da biblioteca o movie clip boto_liga_desliga 28. Insira um layer abaixo e renomeie de peixe 29. Nesta etapa voc deveria criar um movie clip, mas vamos aproveitar um movie clip que vem no Flash! 30. Windows - Janela > Common Libraries - Bibliotecas Compartilhadas > Movie clips > selecione Fish Movie Clip - Peixe Movie Clip 31. Arraste da Biblioteca o movie clip do peixe 32. Mantendo selecionada a linha do tempo 1 da camada peixe > Action - Ao > Stop 33. Salve a animao como exer20.htm > Ctrl+Enter e teste sua animao clicando no boto EXERCCIO 21 - CENAS USANDO ACTION GO TO 01. Salve sua animao como exer22.fla 02. Desenhe uma bola 03. Selecione a bola > F8 > Smbolo grfico 04. Selecione a linha de tempo 50 e mude a posio da bola 05. Clique entre a linha de tempo 1 e 50 > boto direito do mouse > Create Motion Tween - Criar movimento entre 06. Insert - Inserir > Scene - Cena 07. Ser exibida a Cena 2 08. Digite CENA 2 09. Selecione o texto > F8 > Smbolo Grfico 10. Selecione a linha de tempo 50 e mude a posio do texto 11. Clique entre a linha de tempo 1 e 50 > boto direito do mouse > Create Motion Tween - Criar movimento entre 12. Selecione a linha de tempo 1 13. Selecione o texto > Modify - Modificar > Transform - Transformar > Scale and Rotate Escala e Rotao > Escala: 10 14. Insert - Inserir > Scene - Cena 15. Ser exibida a Cena 3 16. Windows - Janela > Common Libraries - Bibliotecas Compartilhadas > Movie Clip > selecione o Fish Movie Clip - Peixe e arraste para Cena 3 17. Selecione a linha de tempo 50 e mude a posio do peixe 18. Windows- Janela > Library - Biblioteca 19. Option - Opo > New Symbol - Novo Smbolo 20. Crie um boto escrito SEGUIR 21. No esquea de colocar > F6 > nos estgios Over, Down e Hit 22. Option - Opo > New Smbolo - Novo Smbolo 23. Crie um boto escrito VOLTAR 24. No esquea de colocar > F6 > nos estgios Over, Down, Hit 25. Volte Cena 1 26. Insira um layer - camada acima e arraste da biblioteca o boto SEGUIR 27. Volte Cena 2 28. Insira um layer - camada acima e arraste da biblioteca o botes: VOLTAR e SEGUIR 29. Volte Cena 3 30. Insira um layer - camada acima e arraste da biblioteca o boto VOLTAR 31. Ctrl+Enter e teste sua animao! 32. Observe que as Cenas so exibidas automaticamente em Loop

33. Vamos parar cada cena e programar para que seja exibida outra somente se clicarmos nos botes SEGUIR e VOLTAR 34. Para que as Cenas sejam exibidas somente do tamanho que foram criadas, vamos inserir uma ao FSCommand, mas s necessrio inserir na Cena 1 35. Selecione a linha de tempo 1 da cena 1 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em FSCommand Na caixa de parmetros digite: Command - Comado: allowscale Arguments Argumentos: false 36. Agora vamos programar para que pare cada Cena e que ela fiquem em loop at que seja clicado os botes SEGUIR e VOLTAR 37. Selecione a linha de tempo 50 da Cena 1 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Stop Goto com os seguintes parmetros: Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 38. Selecione a linha de tempo 50 da Cena 2 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Stop Goto com os seguintes parmetros: Scene 2 - Cena 2 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 39. Selecione a linha de tempo 50 da Cena 3 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Stop Goto com os seguintes parmetros: Scene 3 - Cena 3 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 40. Selecione o boto SEGUIR na Cena 1 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Goto com os seguintes parmetros: Scene 2 - Cena 2 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 41. Selecione o boto SEGUIR na Cena 2 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Goto com os seguintes parmetros: Scene 3 - Cena 3 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 42. Selecione o boto SEGUIR na Cena 1 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Goto com os seguintes parmetros: Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar

43. Selecione o boto SEGUIR na Cena 3 > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em Goto com os seguintes parmetros: Scene 2 - Cena 2 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro: 1 (x) Go to and Play - Ir e Rodar 44. Salve sua animao e Ctrl+Enter para testa-la EXERCCIO 22 - HTML COM FRAMES USANDO GET URL 01. Neste exemplo requer conhecimentos de HTML! 02. Criar a pgina index.htm em um editor de HTML ou no Bloco de Notas: <html> <head> <title>EXERCCIO 23</title></head> <frameset cols="100,*" framespacing="0" border="0" frameborder="0"> <framename="menu" target="menu" scr="munu.htm" scrolling="no"noresize> <framename="apre" target="apre" scr="apre.htm" scrolling="auto" noresize> <noframes> <body> <p>Esta pgina usa quadros mas seu navegador no aceita quadros.</p> </body> </noframes> </frameset> </html> *Observe que demos o nome ao target - alvo de apre referente a pgina apre.htm 03. Crie uma pgina apre.htm em um editor de HTML ou Bloco de Notas: <html> <head> <title>Apresentao</title></head> <base target="apre"> <body> <h1 aling="center">Apresentao</h1> </body> </html> 04. Crie uma pgina produtos.htm em um editor de HTML ou Bloco de Notas: <html> <head> <title>Produtos</title></head> <body> <h1 aling="center">Produtos</h1> </body> </html>

05. Crie uma pgina clientes.htm em um editor de HTML ou Bloco de Notas: <html> <head> <title>Clientes</title><head> <body> <h1 aling="center">Clientes</h1> </body> </html> 06. Abra o Flash, pois vamos criar os botes do menu! 07. Salve sua animao como menu.fla 08. Clique no cone 12.0 fps e troque o tamanho da animao de 100 x 400 e com a cor de fundo para azul escuro 09. Windows- Janela > Library - Biblioteca 10. Options - Opes > New Symbol - Novo Smbolo 11. Crie um boto escrito Apresentao 12. No esquea de colocar > F6 > nos estgios Over, Down e Hit 13. Options - Opes > New Symbol - Novo Smbolo 14. Crie um boto escrito Produtos 15. No esquea de colocar > F6 > nos estgios Over, Down e Hit 16. Options - Opes > New Symbol - Novo Smbolo 17. Crie um boto escrito Clientes 18. No esquea de colocar > F6 > nos estgios Over, Down e Hit 19. Options - Opes > New Symbol - Novo Smbolo 20. Crie um boto escrito Email 21. No esquea de colocar > F6 > nos estgios Over, Down e Hit 22. Volte Cena 1 23. Arraste da biblioteca os botes: Apresentao, Produtos, Clientes e Email, posicionando um abaixo do outro 24. Selecione o boto Apresentao > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em GETurl com os seguintes parmetros: URL: digite apre.htm Windows - Janela: digite apre (observe que o alvo original que demos na pgina index.htm foi target="apre") 25. Selecione o boto Produtos > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em GETurl com os seguintes parmetros: URL: digite produtos.htm Windows - Janela: digite apre 26. Selecione o boto Clientes > boto direito do mouse > Actions - Aes > Basic Actions - Aes Bsicas > duplo clique em GETurl com os seguintes parmetros: URL: digite clientes.htm Windows - Janela: digite apre 27. Selecione o boto Email > boto direito do mouse > Actions - Aes > Basic Actions Aes Bsicas > duplo clique em GETurl com os seguintes parmetros: URL: digite seu Email > mailto:nome@provedor.com.br Windows - Janela: digite apre 28. Salve a animao! 29. File - Arquivo > Publish Settings - Configuraes de publicao 30. Ser aberta a caixa de dilogo para Publicao: 31. Para publicar uma pgina HTML, voc precisa de dois arquivos: menu.swf e menu.htm 32. Mantendo a caixa de dilogo para Publicao aberta:

33. Selecione a pasta Formats - Formatos 34. (x) Flash (.swf) e (x) HTML (.html) 35. Deselecione ( ) Use Default Names - Usar Nomes Padro 36. No item HTML troque menu.html para menu.htm 37. Publish - Publicar 38. Clique OK e foi criados os arquivos: menu.swf e menu.htm 39. Abra a pgina indes.htm nos navegador e teste os botes *Dica: se as pginas em HTML no so em frames, quando for configurar as aes dos botes no Flash: GetURL com os seguintes parmetros: URL > digite o nome da pgina arquivo.htm Windows - Janela > deixe em branco PUBLICAO 01. Salve seu arquivo.fla 02. File - Arquivo > Publish Settings - Configuraes de Publicao 03. Ser aberta a caixa de dilogo para Publicao: 04. Vamos detalhar as formas de Publicao: PUBLICAR PGINA HTML 01. Para Publicar uma pgina HTML, voc precisa de dois arquivos: arquivo.swf e arquivo.htm 02. Mantendo a caixa de dilogo para publicao aberta: 03. Selecione a pasta Formats - Formatos 04. (x) Flash (.swf) e (x) HTML (.html) 05. Deselecione ( ) Use Default Names - Usar Nomes Padro 06. No item HTML troque arquivo.html para arquivos.htm 07. Puplish - Publicar 08. Clique OK e foi criado os arquivos: arquivo.swf e arquivo.htm PROPRIEDADES DO ARQUIVO.SWF Quando se seleciona a forma de publicao para arquivo.swf exibida uma pasta chamada Flash que tem as seguintes propriedades: EXERCICIO 23 - IMAGENS CARREGANDO 01. Window - Janela > Library - Biblioteca ou ctrl +l 02. Options - Opes > New Symbol - novo smbolo 03. Ser exebido uma caixa de dilogo: Name - Nome ? digite texto Behavior - Comportamento > (X) Graphic - grfico 04. Digite ? Imagens Caregando... 05. selecine o texto > ctrl + K para centralizar em cima do sinal +

06. Options - opes > New Symbol - Novo Smbolo 07. Ser exebido uma Caixa de Dilogo: Name - Nome ? Digite texto_movie Behavior - Comportamento > (X) Movie Clip 08. Arrasta da biblioteca o texto para edio do texto_movie 09. Selecione o texto > ctrl+K para centralizar em cima do sinal + 10. Selecione as linha de tempo 5 e 10 > F6 (individualmente) 11. Selecione na linha de tempo 5 12. Selecione o texto > boto direito do mouse > Panel- Painis > Effect - Efeito > alpha= 50% 13. Selecione na linha de tempo 10 14. Selecione o texto > boto direito do mouse > Panel- Painis > Effect - Efeito > alpha= 25% 15. Clique entra a linha de tempo 1 e5 > boto tireito do mouse Create Movie Tween Criar Movimento Entre 16. Clique entra a linha de tempo 5 e 10 > boto tireito do mouse Create Movie Tween Criar Movimento Entre 17. Volte a cena 1 18. Arraste da Biblioteca o s;imbolo texto_movie para Cena 1 19. Selecione as linhas de tempo 5 e10 >F6 (individualmente) 20. Selecione na linha de tempo 11> F7 (Blank Keyframe- Chave de Quadro em Branco) 21. Obeserve que a animao ir se iniciar na linha de tempo 1 22. Crie uma animao at a linha de tempo 100 23. Salve sua animao como exer33.fla 24. Selecione a linha de tempo 5 > ao > if Frame if Loaded Scene - Cena > Scene 1 Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro > 100 Clique + Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro > 11 (X) Go To and play - ir e rodar 25. Selecione a linha de tempo 10 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro > 1 ( x ) Go To and Play - ir e rodar 26. Selecione a linha de tempo 100 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmero Frame - Quadro > 11 ( x ) Go To and Play - ir e rodar 27. Salve o arquivo e ctrl+ enter e teste sua animao EXERCCIO 24: IMAGENS CAREGANDO EM PORCETAGEM 01. Window - Janela > Library - Biblioteca ou Ctrl+ L 02. Options -Opes > New Symbol - Novo Smbolo

03. Ser exebodo uma caixa de dilogo ? Name - Nome : digite 100% Behavior - comportamento > ( X ) Graphic - Grfico 04. View - Visualizar > Grid -Grande > Show Grid - exibir Grande 05. Desenhe um retngulo de 10 x 1 quadradinhos, pintando um quadradinho de azul escuro e outro de azu claro, sucessvamente. 06. Selecione o retngulo > ctrl + G para agrupar 07. Selecione o retngulo > ctrl +K para centralizar em cima do sinal + 08. Digite abaixo do retngulo 100% 09. Selecione o smbolo 100% na biblioteca 10. Options - opes > Duplicate - Duplicar Smbolo Name - Nome ? digite 90% Behavior - comportamento > ( X ) Graphic -Grfico 11. Duplo clique sobre o smbolo sobre 90% na biblioteca para ser ativado sua edio 12. Observe na parte superior foi exibido a edio do sbolo 90% 13. Selecine o retngulo > ctrl +Shft+g para desagrupar 14. Apague o ltimo quadrinho da direita 15. Digite abixo do retngulo 90% no lugar de 100% 16. Selecione o smbolo 90% na biblioteca 17. Options - Opes > Duplicate - Duplicar smbolos Name - Nome ? digite 80% behavior - Comportamento > ( X ) Graphic - Grfico 18. Duplo Clique sobre o smbolo 80% na Biblioteca para ser ativado sua edio 19. Observe se na parte superior foi exibido a edio do smbolo 80% 20. Apague o ultimo quadrinho da direita 21. Digite abaixo do retngulo 80% no lugar de 90% 22. Repita o mesmo procedimento , a cada vez retirando um quadrinho , e crie os smbolos 70%, 60%, 50%, 40%, 30%, 20% e 10% 23. Volte cena 1 24. Selecione na biblioteca o smbolo 10% e arraste para Cena1 25. Selecione o smbolo 10% na Cena 1 > ctrl +K para centralizar 26. Selecione as linhas de tempo 5e 10 > F6 (individualmente) 27. Selecione a linha de tempo 11> F7 28. Selecione na Biblioteca o Smbolo 20% e arraste para Cena 1 29. Selecione o smbolo 20% na Cena 1 > ctrl +K para centralizar 30. Selecione as linhas de tempo 15e 20 > F6 (individualmente) 31. Selecione a linha de Tempo 21 > F7 32. Selecione na biblioteca o smbolo 30%e aaste para cena 1 33. Selecione o smbolo 30% na Cena 1 > ctrl + k para Centralizar 34. Selecione as linhas de tempo 25 e 30 > F6 (individualmente ) 35. Selecine a linha de tempo 31 > F7 36. Selecione na biblioteca o smbolo 40% e arraste para Cena 1 37. Selecione o smbolo 40% na Cena 1 > ctrl + K para centralizar 38. Selecione as linhas de tempo 35 e 40 > F6 (individualmente) 39. Selecione a linha de tempo 41> F7 40 Selecione na biblioteca o smbolo 50% e arraste para cena 1 41. Selecione o smbolo 50% na cena 1 > ctrl + K para centralizar 42. Selecione as linhas de tempo 45 e 50 > F6 (lndividualmente> 43. Selecione a linha de tempo 51 > F7 44. Selecione na biblioteca o smbolo 60% e arraste para Cena1 45. Selecione i smbolo 60% na Cena 1 > ctrl +K para centralizar

46. Selecione as linha de tempo 55 e 60 > F6 (individualmente) 47. Selecione a linha de tempo 61 > F7 48. Selecione na Biblioteca o smbolo 70% e arraste para Cena 1 49. Selecione o smbolo 70% na cena 1> ctrl +K para centralizar 50. Selecione as linha de tempo 65 e 70 > F6 (individualmente) 51. Selecione a linha de tempo 71> F7 52. Selecione na Biblioteca o smbolo 80% e arraste para cena 1 53. Selecione o smbolo de 80% na cena 1 > ctrl +K para centralizar 54. Selecione as linha de tempo 75 e 80 > F6 (individualmente ) 55. Selecione a linha de tempo 91 > F7 56. Selecione na biblioteca o smbolo 90% e arraste para Cena 1 57. Selecione o smbolo de 90% na cena 1 > ctrl +K para centralizar 58. Selecione as linha de tempo 85e 90 > F^6 (individualmente ) 59. Selecione a linha de tempo 91 > F7 60. Selecione na biblioteca o smbolo de 100% e arraste para a Cena 1 61. Selecione o smbolo 100% na cena 1 > ctrl +K para centralizar 62. Selecione as linha de tempo 95 e 100 > F6 ( individualmente) 63. Salve sua animao como exer34.fla 64. Insert - Inserir > Scene - Cena > Scene 2 - Cena 2 65. Crie uma animao at a linha de tempo 50 na cena 2 66. Insira as cenas 3 at 11 67. Crie uma animao ate a linha de tempo 50 em cada Cena 68. Volte Cena 1 69. Seleciona a linha de tempo 5 > Ao > If Frame is Loaded Scene - cena > Scene - Cena 2 Type- Tipo > Frame Number- Quadro Nmero Frame - Quadro > 50 Clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 11 ( x ) Go To and Play - Ir e Rodar 70. Selecione a linha de tempo 10 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 1 ( X ) Go To and Play - Ir e Rodar 71. Selecione a linha de tempo 15 > Ao > If Frame is Loaded Scene - Cena > Scene 3 - Cena 3 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 21 ( x ) Go To and Play - Ir e Rodar 72. Selecione a linha de tempo 20 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 11

( X ) Go To and Play - Ir e Rodar 73. Selecione a linha de tempo 25 > Ao > If Frame is Loaded Scene - Cena > Scene 4 - Cena 4 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 31 ( x ) Go To and Play - Ir e Rodar 74. Selecione a linha de tempo 30 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 21 ( X ) Go To and Play - Ir e Rodar 75. Selecione a linha de tempo 35 > Ao > If Frame is Loaded Scene - Cena > Scene 5 - Cena 5 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - qUADRO > 41 ( x ) Go To and Play - Ir e Rodar 76. Selecione a linha de tempo 40 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 31 ( X ) Go To and Play - Ir e Rodar 77. Selecione a linha de tempo 45 > Ao > If Frame is Loaded Scene - Cena > Scene 6 - Cena 6 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - qUADRO > 51 ( x ) Go To and Play - Ir e Rodar 78. Selecione a linha de tempo 50 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 41 ( X ) Go To and Play - Ir e Rodar 79. Selecione a linha de tempo 55 > Ao > If Frame is Loaded Scene - Cena > Scene 7 - Cena 7 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50

clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - qUADRO > 61 ( x ) Go To and Play - Ir e Rodar 80. Selecione a linha de tempo 60 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 51 ( X ) Go To and Play - Ir e Rodar 81. Selecione a linha de tempo 65 > Ao > If Frame is Loaded Scene - Cena > Scene 8 - Cena 8 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 71 ( x ) Go To and Play - Ir e Rodar 82. Selecione a linha de tempo 70 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico 84. Selecione a linha de tempo 80 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 71 ( X ) Go To and Play - Ir e Rodar 85. Selecione a linha de tempo 85 > Ao > If Frame is Loaded Scene - Cena > Scene 10 - Cena 10 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 91 ( x ) Go To and Play - Ir e Rodar 86. Selecione a linha de tempo 90 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 81 ( X ) Go To and Play - Ir e Rodar 87. Selecione a linha de tempo 95 > Ao > If Frame is Loaded Scene - Cena > Scene 11 - Cena 11 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 2 - Cena 2

Type - Tipo > Frame number - Quadro Nmero FRAME - qUADRO > 1 ( x ) Go To and Play - Ir e Rodar 88. Selecione a linha de tempo 100 > Ao > Go To Scene - Cena > Scene 1 - Cena 1 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 91 ( X ) Go To and Play - Ir e Rodar 89. Selecione a linha de tempo 50 da cena 11 > Ao > If Frame is Loaded Go To Scene- Cena > Scene 2 - Cena 2 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 1 ( x ) Go To and Play - Ir e Rodar 90. Salve seu arquivo e Ctrl+ Enter para testar sua animao , mas observe que o efeito s ser visualizado se vo publicar esta animao na internet Frame - Quadro > 61 ( X ) Go To and Play - Ir e Rodar 83. Selecione a linha de tempo 75 > Ao > If Frame is Loaded Scene - Cena > Scene 9 - Cena 9 Type - Tipo > Frame Number - Quadro Nmerico Frame - Quadro > 50 clique + Go To Scene- Cena > Scene 1 - Cena 1 Type - Tipo > Frame number - Quadro Nmero FRAME - QUADRO > 81 ( x ) Go To and Play - Ir e Rodar

EXERCCIO 25 - ARQUIVO EM FLASH PARA IMPRESSO 10. Selecione o estgio Over , Down e Hit > F6 (individualmente) 11. Volte a cena 12. Selecione a linha de tempo 1 13. Arraste da Bibliotece o Boto para Cena 14. Agora vamos determinar o frame - quadro que sera impresso 15. Selecione a linha de tempo 1> boto direito do mouse > Panels - Painis > Frame - Quadro > Label - Rtulo > digite #p 16. Insira um layer - camada acima 17. Selecione a linha de tempo 10 da camada 2 > F7 18. Mantendo selecionado a linha de tempo 10 > digite no imprimir esta parte 19. Agora vamos determinar o frame - quadro que no ser impresso 20. Selecine a linha de tempo 10 > boto direito do mouse > Panels - Paineis > FramaQuadro > Label - Rtulo > digite !#p 21. Selecione a linha de tempo 1 > selecione o boto imprimir> Ao - Ao novemente > print 22. Ser exibida a caixa sobre a impresso? Print - impresso pode ser ?

As vectors- como vetores - que imprime em altaqualidade e sem transparencia , ou seja , objetos que contm transparncia ou efeitos de cor no podem ser impressos nesta opo As Bitmap - como Bitmap - imprime o canal alpha ou efeito de cor e melhor opo para uma impresso de alta resoluo Location - Localizao - especifica qual a linha de tempo a ser impressa? Level- Nvel- especifica o nmero do arquevo.swf a ser caregado Target - Alvo - especifica o alvo (X) Target - Alevio > digite#p Bounding - Limites da Impresso Movie - Animao - arquivo.swf que deve ter m Label-Rtulo >#b Frame - Quadro - determina o quadro que pode ser impresso Max determina todos os frames - quadros podero ser impressos Selecione Frame - Quadro 23. Observao ? a ao para imprimir pode ser feita no boto ou em movie clip 24. File - Arquivo> Pubish Settings- comfiguraes de publicao 25. Ser aberta a caixa de dilogo para Publicao? (X) exer39.swf e exer39.html 26. Deselecione ( ) Use Default Names - Usar Nomes Padro 27. No item HTML troque exer39.html para exer39.htm 28. Selecine a pasta HTML > deselecine Display Menu - Exebir Menu Isto permite que o menu do Flash no ser exebido 29. Publish - Pubicar 30. Clique OK 31. Abra o navegador do arguivo exer39.htm 32. Clique no boto Imprimir e imprima a animao EXERCCIO 26: ARQUIVO EM FLASH COMO SCREENSAVER Para criar um ScreenSaver ou Proteo de Tela para seu computador , siga as seguntes intrues: 01. Crie sua animao no Flash 02. Insira na linha de tempo 1> Aao > Ao Bsica FSCommand> Command - Comando > digite Fullscreen Argument - Argumento > digite true 03. Com esta ao a animao ocupar dota tele do computador 04. Salve seu arquivo 05. File - Arquivo > Publish Settings - comfigurae de publicao 06. Ser aberta a caixa de dilogo para Publicaco 07. Agora temos que criar um arquivo executvel Exite duas formas de publicao para criar arquivos executaveis ? Window Projector (arquivo.exe)- para Windows Macintosh Projector (arquivo .hqx) - para Macintosh 08. Clique Publish - Publicar e est criado um arquivo executavel! 09. Com o arquivo .exe necessrio transformar este para arquivo .scr atravs de programas de ScreenSaver, faa dowload do programa: Screnweaverv v. 2.051 Http://screenweaver.com/ 10 Faa a transformao

EXERCCIO 27: COMO CRIAR GIF ANIMADO Quando se seleciona a forma de pulicao para GIF Image - Imagem Gif (arquivo.gif) exibida uma pasta chamada Gif que tem as seguintes propriedades: Dimensions - Dimenes - determina as dimenses da imagem : Width- Largura e Height - Altura Match Movie - animao Original - determina que a imagem ser exibida no tamanho original que foi criada Playback Static - Estatistica - determina imagem esttica Animated - Animado - datermine imagem animada (Selecine esta opco) Loop Continuosly - Loop Contnuo (selecione esta opo) Repeat X temes - repetir x vezes Options - Opes Optimize Colors - cores otimizadas (selecione esta opo ) Interiace - Interlaar Smooth - suavizar (selecione esta opo) Dither Solids - especifica em pixel as cores disponveis ser compinadas para simular uma cor no disponivel na paleta de cores Remove Gradients - Remover Gradientes - remove cores gradientes Transparent - Transparente Opaque- Opaco Transparent - Transparent (selecione esta poo para criar um gif animado transparente) Alpha Palleta Type - tipo de Paleta web 216- usar as 216 cores do navegador (selecione esta opo ) Adptative - adaptvel Web Snap Adaptative - mesma coisa que o item adaptavel , mas ele comverte cores similares em 216 cores (no case de imagens com 256 cores) Custom - Personalizar pallet- paleta de cores , case seja selecionado o item Personalizar clique Pblish - publicar e est criado seu gif animado!

EXERCCIO 28: ACTIONSCRIPT IF FRAME IS LOADED If Frame is loaded - permite que a animao comece a rodar, somente depois que for totalmente caregada no navegador do usuario, isto , efeito conhecido como "Imagens Caregando ..." Nas linha de tempo 1.5.10> Texto Imagens Caregando ... Na linha de tempo 11> onde se inicia a animao propriamente dita Na linha de tempo 100 > final da animao Na linha de tempo 5 > Ao > se caregou o ltimo quadro , neste caso = 100, v para o nicio da animao, neste caso = 11 se esta declarao no for verdadeira permita que a animao continue rodando

Na linha de tempo 10> Ao > voltar ao inicio, neste caso =1, pois a declarao falsa, a animao no foi carregada! Suponhamos que a animao j foi carregada no navegador e quando passar na linha de tempo 5> ela pula para a linha de tempo 11 e comea a rodar a aminao Quando chega na linha de tempo 100> no necessrio mais voltar para o Texto Imagens Caregando ...> ir para linha de tempo 11 > que animao propriamente dota, ficando em loop (entr 11 e 100) Ateno : Este efeito s visualizado quando a animao estiver publicada na Internet

EXERCCIO 29 - CONTADOR Crie um novo filme contendo um nico Frame. Selecione a ferramenta Text Tool e digite o nmero 0 (zero) no Stage. Em seguida abra o painel Text Options em menu Window > Panels > Text Options. No painel, altere o tipo para Dynamic Text. No campo Variable, escreva um nome que este textfield receber. Exemplo: contador. Deixe desmarcadas as opes HTML, Border/Bg Selectable. Este campo de texto ser uma varivel chamada contador, cujo valor inicial o valor 0 (zero) que est digitando nele. No Stage insira um boto. Voc pode inserir um boto presente na biblioteca Button, se desejar. Em seguida clique um avez nesse boto, para inserirmos o Action. Portanto, abra o ainel Actions. Nele, clique duas vezer na ao chamada Actions (logo abaixo de Basic Actions). Na listagem que aparecer, clique 2x no tem setVariable. Abrir na parte inferior do Painel Object Actions, os parmetros para voc configurar. No campo Variable, digite contador, que o nome da varivel que queremos alterar. No campo value, digite: int(contador + 10) Marque a caixa Expression. Com isso estamos informando que queremos que o valor de contador aumente 10 cada vez que o boto for pressionado. Usamos a funo int na frente para informar que o contedo se trata de uma varivel numrica. Caso contrrio o resultado seria 10101010. Salve e teste. EXERCCIO 30: INTERAGINDO UM CONTADOR COM UM MOVIE CLIP Vamos usar o exerccio anterior. Abra o exerccio 36. V ao menu File > Save as. Salve como ex37. Escolha a ferramenta Arrow Tool e selecione e textfield contador. Em seguida transformeo em Movie Clip apertando F8. Com isso estamos fazendo com que o contador fique dentro do Movie Clip, podendo ser acionado tanto por botes e por outros Movie Clips dentro do filme. Coloque o nome da instncia, na janela Instance, desse Movie Clip como sendo a palavra qtd. Clique no boto e veja o painel Object Actions. Apague o Action inserido e aplique os Actions Tell Target, colocando em Target o Movie Clip qtd e em seguida, aplique o Action Set Variable passando como Variable a palavra contador e em Value: int(contador + 10). No campo Value marque a opo Expression. Abra a biblioteca de Movie Clips (menu Window > Common Libraries > Movie Clips). Nessa janela, clique no tem Fish Movie Clip e arraste para o Stage. Clique duas vezer no peixe no Stage para edit-lo. clique no ltimo Frame deste Movie Clip e insira o Action Tell Target. No campo Target digite ../qtd Em seguida aplique o Action SetVariable passando como argumento: Variable: contador Value: int(contador 50) Marque a opo Expression. Salve e teste o Movie. Quando o Movie Clip Fish rodar o ltimo Frame dele, o contador subtrair 50. Como o Movie Clip est em Loop, de tempos em tempos o contador diminuir 50. Quando voc pressionar o boto, o contador aumentar 10.

Nota: Observe que a referenciao do comando Tell Target de um Movie Clip para outro muda. Voc deve inserir ../ para informar que aquele Movie Clip que voc est querendo acessar est presente na Timeline principal. Ento quando usar ../? Quando voc estiver acessando um Movie Clip a partir de outro Movie Clip. Se voc estiver acessando o Movei Clip a partir de um boto ou de um Frame inserido na Timeline principal, voc no precisa usar esta referenciao. Estes dois exerccios mostram um uso bsico do Action Script, ou seja, efetuar contas simples como soma e subtrao. Esses clculos, entre outros, feito usando os operadores. No Action Script, os operadores esto presentes no tem Operators do painel Actions. Se voc tem conhecimentos em pregramao saber usar uma boa parte desses operadores, caso contrrio veremos em alguns exerccios do curso. Alm dos operadores, o Aciton Script apresenta ainda, as funes (Action Functions), as propriedades (Action Properties) e os objetos (Action Objects). Durante os captulos do livro veremos alguns desses Actions, fazendo exerccios prticos de sua utilizao. Todo acesso a cada tipo de Action sempre ser feito da mesma maneira, ou seja, clicando 2x no Action que quer aplicar e setar as suas propriedades, argumentos ou parmetros que aparecem no painel. EXERCCIO 31: CRIANDO UMA REA RESTRITA DENTRO DO FLASH Crie um novo filme contendo 3 Frames. Em cada Frame insira um Keyframe. Insira um Action Stop em cada Keyframe. Clique no Frame 1, selecione a ferramenta Text tool e digite a palavra Senha: em seguida crie com a mesma ferramenta, uma rea para digitao da senha. Detalhe: a palavra senha, deixe-a como Static Text (no Painel Text Options). O campo de texto para receber a senha, deixe como Input Text e escolha o tipo Password. No campo Variable, escreva senha. No campo Max Chars. digite 5, para que o campo possa receber no mximo 5 caracteres. Marque a opo Border/Bg e o primeiro cone de Embed Fonts. Em seguida crie um boto. Coloque o Action If (<not set yet>){ No campo Condition, digite: senha ==abc12 (ateno nos dois sinais de igual). Em seguida aplique o Action Go To and Stop Frame 2. Aqui informamos: se a senha form abc12, ento v para o Frame 2. Agora, clique na linha } else { Aplique o Action Go To and Frame 3. Aqui informamos, se a senha no for abc12, ento v para o Frame 3. Clique no Frame 2. Digiet no Stage a frase: rea Restrita. Clique no Frame 3. Digite a frase Senha errada. Tente novamente. E crie um boto com Action para retornar ao Frame 1. Salve e teste! EXERCCIO 32: CRIANDO UMA SCROLL AREA (REA DE TEXTO ROLVEL) Uma Scroll Area seria um campo de texto com botes de rolagem. Neste exerccio criaremos uma Scroll Area para entrada de dados. Crie um novo filme contendo um Frame. Selecione a ferramenta Text Tool e clique no Stage. Em seguida redimensione a rea de texto para um tamanho onde o usurio possa entrar alguns dados.

No Painel Text Options, mude o campo e texto para o tipo Input Text e do tipo Multiline. Marque as opes Word Wrap e Border/Bg. Em Max. char. digite um valor como 100. Coloque o nome no campo Variable de texto. Em seguida crie dois botes e insira um em cada extremidade no lado direito do campo de texto. Clique no boto de cima. Insira o Action Set Variable. No campo Variable digite a palavra texto e aplique o Action Scroll persente no [item Functions. No campo Value, digite texto, aplique o Action Scroll. Em seguida subtraia o valor 1. Marque a opo Expression. Clique on boto de baixo e aplique o mesmo Action, porm neste caso somando o valor 1. Em outras palavras: aplique um Set Variable. No campo Variable, digite texto e aplique o Action Scroll e some 1. O resultado deste boto: texto.scroll = texto.scroll + 1; Salve o teste. Digite bastante no seu campo de texto e depois pressione os botes. Nota: Posteriormente faremos um exerccio de Scroll usandoum texto j inserido no campo. EXERCCIO 33: CARREGANDO O CONTEDO DE UM ARQUIVO EXTERNO DENTRO DO FLASH Crie um novofilme com um Frame. Selecione a ferramenta Text Tool e clique no Stage. Aumente a rea de texto para que ele possa receber uma quantidade suficiente de texto. Em Text Options, deixe esta rea como Dynamic Text. Escolha o tipo Multiline. Em Variable digite texto. Marque as opes HTML e Word Wrap. Os outros tens deixe desmarcado (inclusive o Embed Fonts). Clique no Frame 1 e aplique um Action diretamente no Frame: aplique o Aciton Loadvariables. No campo URL digite o nome do arquivo: textoexterno.txt Em Location deixe level e marque 0 (zero). Pronto. Salve o exerccio. Agora falta montar o arquivo texto. Antes de prosseguirmos com o exerccio sempre bom deixar claro que o arquivo txt dever Ter a seguinte estrutura: Nome da varivel (mesmo nome do campo de texto)=Palavra1 palavra2, etc. Ento, vamos editar o arquivo textoexterno.txt. Abra o bloco de notas e escreva na mesmalinha: texto=Este texto est inserido no arquivo de texto externo ao Flash. Salve o arquivo como textoexterno.txt no mesmo diretrio que o arquivo Flash. Teste seu filme! Observe que nas opes do texto (Text Options), voc marcou a caixa HTML. Isso significa que voc pode inserir comandos HTML dentro do arquivo texto que ele set carregado dentro do campo texto! Se quiser testar, altere seu arquivo textoexterno.txt para: texto=Este<b>texto</>est<u>inserido</u>no arquivo de<font color=#FF00CC>texto externo</font>ao<font size=20>Flash</font>. EXERCCIO 34: CARREGANDO VRIOS TEXTOS NO STAGE E CRIANDO ANIMAES Crie um novo filme com 3 Layers. Cada um com 20 Frames. Clique no Frame 1 do Layer 2 e insira outra rea de texto do tipo Dynamic Text. Coloque o nome em Variable de texto2.

No Layer 3 aplique o Action no Frame 1: Load Variables. No campo URL digite: textos.txt e coloque level 0. Clique no Frame 20 do Layer 1. Crie um Keyframe. Arraste o campo de texto deste Layer para uma outra posio. Em seguida, clique no Frame 1 e aplique o Tweening Motion. Agora clique no Farme 1 do Layer 2. Selecione o campo de texto 2 e transforme-o em Symbol do tipo Graphics (F8). Em seguida, clique no Frame 20 e crie um Keyframe. Clique no Frame 1 e clique 1x no campo de texto2. Aplique um efeito chamado Brigtness com valor 100% (presente no panel Effects), em seguida, ainda no Frame 1, aplique um Tweening Motion. Se quiser, posicione o smbolo em outra posio no Stage. Salve o exerccio. Vamos criar o arquivo texto. Abra o bloco de notas. Dikgite o seguinte contedo na mesma linha: Texto1=Flash 5&texto2= <a href=http://www.macromedia.com>Macromedia </a> Salve como textos.txt. E teste o seu filme! Observe que a palavra Macromedia contm um link! Notas: Os campos de textos podem ser inseridos do tipo Multiline tambm. Neste caso, devem vir com as opes Word Wrap e HTML marcadas. Ateno ao sinal & presente no arquivo de texto. Esse sinal ir informar ao programa que nesse arquivo tem outra varivel. Todas as vezer que quisermos inserir n variveis no mesmo arquivo, basta inserir o & em seguida manter a mesma estrutura do arquivo, ou seja, varivel=palavra palavra, etc. Procure no deixar espao entre o & e o nome da noma varivel. Isso evita a ocorrncia de bugs. EXERCCIO 35: CRIANDO UM SCROLL AREA COM LOAD VARIABLES Crie um novo filme com um Frame. Insira no Stage uma rea de texto do tipo Dynamic Text Multiline com o nome texto. Na caixa Text Options, marque os tens HTML, Border/Bg e Word Wrap. Deixe desmarcado o tem Embed Fonts. Crie dois botes para criar o Scroll, como foi visto no exerccio 42. Inclusive coloque os mesmos Actions nos dois botes. Clique no Frame 1 e insira o Action Loadvariables. No campo URL e digite: scroll.txt. Deixe level 0 (zero). Salve o exerccio. Agora crie o arquivo scroll.txt com o seguinte contedo, digitando tudo na mesma linha: Texto=Este um exemplo de Scroll Area carregando um teot externo. Voc pode acessar esta rea para cima ou para baixo clicando nos botes ao lado. Aps a ltima palavra, insira vrios enters para o Scroll funcionar, j que a quantidade de texto pequena. Salve e teste o exerccio! Nota: Lembre-se que voc pode alterar a fonte a as suas caractersticas no painel Character, como tambm possvel alterar o tipo de alinhamento do campo de texto no painel Paragraph.

Vous aimerez peut-être aussi