programaÇÃo para internet ica - wordpress.comprogramaÇÃo para internet rica prof. dr. daniel...
TRANSCRIPT
![Page 1: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/1.jpg)
PROGRAMAÇÃO PARA INTERNET RICA
Prof. Dr. Daniel Caetano
2012 - 1
INTRODUÇÃO AO ACTIONSCRIPT 3
![Page 2: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/2.jpg)
Objetivos
• Apresentar os conceitos básicos da linguagem ActionScript 3.0
• Capacitar o aluno para criar programas simples usando ActionScript 3 e o Adobe Flash CS4
• Trabalho B!
![Page 3: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/3.jpg)
Material de Estudo
Material Acesso ao Material
Tutorial Extra http://www.caetano.eng.br/aulas/pir/ Adobe Flash CS4
Apresentação http://www.caetano.eng.br/aulas/pir/ (Aula 12)
Material Didático -
Google ActionScript 3 AS3
![Page 4: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/4.jpg)
O QUE É ACTIONSCRIPT 3?
![Page 5: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/5.jpg)
Introdução
• Evolução parecida com HTML
• Macromedia/Adobe
– Flash Shockwave
– Animações...
• Necessidade de interação
– Formulários
– Botões...
• Action Script
![Page 6: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/6.jpg)
Introdução
• ActionScript 1
– Extremamente limitado
• ActionScript 2
– Controle de animações
– Recursos básicos de uma linguagem OO
• ActionScript 3
– Linguagem OO completa
– Similar ao JavaScript em muitos aspectos
– Facilita a criação de animações!
![Page 7: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/7.jpg)
ACTIONSCRIPT 3 NA PRÁTICA
![Page 8: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/8.jpg)
ActionScript 3 na Prática
• É possível usar o AS3 como uma linguagem “independente”
– FlashDevelop
– http://www.flashdevelop.org/
• Para usar AS3, programaremos no Flash
• Inicie o Flash CS4:
![Page 9: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/9.jpg)
ActionScript 3 na Prática
• Aguarde o carregamento...
![Page 10: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/10.jpg)
ActionScript 3 na Prática
• E, finalmente, uma janela aparecerá...
![Page 11: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/11.jpg)
ActionScript 3 na Prática
• E, finalmente, uma janela aparecerá...
![Page 12: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/12.jpg)
ActionScript 3 na Prática
• Vamos, agora, preparar a área de trabalho
• Selecione Window > Workspace > Developer
![Page 13: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/13.jpg)
ActionScript 3 na Prática
• Selecione Window > Actions
![Page 14: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/14.jpg)
ActionScript 3 na Prática
• Selecione Window > Actions
![Page 15: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/15.jpg)
ActionScript 3 na Prática • Tela de trabalho
![Page 16: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/16.jpg)
ActionScript 3 na Prática • Primeiro programa...
![Page 17: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/17.jpg)
ActionScript 3 na Prática • Executando...
Control > Test Movie
• Ctrl + Enter também funciona!
![Page 18: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/18.jpg)
ActionScript 3 na Prática • Resultado...
• Não aparece no filme?
– Não...
– trace é um comando de teste!
![Page 19: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/19.jpg)
ActionScript 3 na Prática • E se houver erro...?
![Page 20: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/20.jpg)
VARIÁVEIS EM ACTIONSCRIPT 3
![Page 21: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/21.jpg)
Variáveis em ActionScript 3 • Teste o programa...
• texto é uma variável do tipo String
![Page 22: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/22.jpg)
Variáveis em ActionScript 3 • Declaramos variáveis sempre assim:
var nome:Tipo = valor_inicial;
• Observe!
![Page 23: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/23.jpg)
Variáveis em ActionScript 3 • Incrementando o programa
• umValor é uma variável do tipo Number
![Page 24: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/24.jpg)
Variáveis em ActionScript 3 • Number aceita valores fracionários...
![Page 25: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/25.jpg)
Variáveis em ActionScript 3 • Há variáveis inteiras também...
• umValor, agora, é uma variável do tipo int
• O valor 42.5 será truncado!
![Page 26: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/26.jpg)
Variáveis em ActionScript 3 • Podemos usar valores em hexadecimal...
• Qual o valor impresso?
![Page 27: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/27.jpg)
Variáveis em ActionScript 3 • Podemos misturar variáveis no trace...
• Execute e observe os resultados...
• Qual a diferença entre eles?
![Page 28: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/28.jpg)
DESENHANDO NA TELA COM ACTIONSCRIPT 3
![Page 29: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/29.jpg)
Desenhando em ActionScript 3 • Para desenhar na tela: criar um Sprite
• Sprite é um desenho que pode se mover
• Depois, precisamos adicionar o sprite como um filhote da animação corrente (addChild)
• Experimente o código abaixo... o que ocorre?
![Page 30: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/30.jpg)
Desenhando em ActionScript 3 • O Sprite não tem figura ainda...
• Precisamos desenhar dentro do sprite
• Experimente!
![Page 31: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/31.jpg)
Desenhando em ActionScript 3 • O Sprite não tem figura ainda...
• Precisamos desenhar dentro do sprite
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
vermelha (rrggbb)
![Page 32: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/32.jpg)
Desenhando em ActionScript 3 • O Sprite não tem figura ainda...
• Precisamos desenhar dentro do sprite
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
vermelha (rrggbb)
Solicita o desenho de um
círculo com centro em 0,0 e
raio 20 pixels
![Page 33: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/33.jpg)
Desenhando em ActionScript 3 • O Sprite não tem figura ainda...
• Precisamos desenhar dentro do sprite
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
vermelha (rrggbb)
Solicita o desenho de um
círculo com centro em 0,0 e
raio 20 pixels
Indica que o desenho do
sprite acabou
![Page 34: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/34.jpg)
Desenhando em ActionScript 3 • Desenhando um retângulo...
• Experimente!
![Page 35: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/35.jpg)
Desenhando em ActionScript 3 • Desenhando um retângulo...
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
azul (rrggbb)
![Page 36: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/36.jpg)
Desenhando em ActionScript 3 • Desenhando um retângulo...
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
azul (rrggbb)
Solicita o desenho de um retângulo com
canto superior esquerdo em 0,0,
largura 100 pixels e altura 200 pixels
![Page 37: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/37.jpg)
Desenhando em ActionScript 3 • Desenhando um retângulo...
• Experimente!
Indica que iniciaremos o
desenho no sprite usando a cor de preenchimento
azul (rrggbb)
Solicita o desenho de um retângulo com
canto superior esquerdo em 0,0,
largura 100 pixels e altura 200 pixels
Indica que o desenho do
sprite acabou
![Page 38: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/38.jpg)
PROPRIEDADES DOS SPRITES
![Page 39: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/39.jpg)
Desenhando em ActionScript 3 • Podemos mover o nosso retângulo
• Experimente!
![Page 40: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/40.jpg)
Desenhando em ActionScript 3 • Resultado
![Page 41: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/41.jpg)
Desenhando em ActionScript 3 • Resultado
![Page 42: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/42.jpg)
Desenhando em ActionScript 3 • Podemos mudar a “opacidade” do sprite
• Experimente!
![Page 43: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/43.jpg)
Desenhando em ActionScript 3 • Podemos “rodar” os sprite
• Experimente!
![Page 44: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/44.jpg)
Desenhando em ActionScript 3 • rotation em graus... Sentido horário!
![Page 45: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/45.jpg)
Desenhando em ActionScript 3 • rotation em graus... Sentido horário!
![Page 46: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/46.jpg)
EIXOS DE COORDENADAS
![Page 47: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/47.jpg)
Coordenadas do AS3 • Eixos de coordenadas do cenário
![Page 48: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/48.jpg)
Coordenadas do AS3 • Eixos de coordenadas do cenário
Ponto (200,100)
![Page 49: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/49.jpg)
Coordenadas do AS3 • Um sprite, tem seus próprios eixos
![Page 50: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/50.jpg)
Coordenadas do AS3 • Quando posicionamos os Sprites,
posicionamos o 0,0 do sprite no cenário
![Page 51: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/51.jpg)
Coordenadas do AS3 • Quando o sprite é rodado, ele roda ao redor
de seu próprio 0,0
![Page 52: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/52.jpg)
Coordenadas do AS3 • Quando o sprite é rodado, ele roda ao redor
de seu próprio 0,0
![Page 53: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/53.jpg)
Coordenadas do AS3 • Para que servem os eixos do sprite?
![Page 54: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/54.jpg)
Coordenadas do AS3 • Para que servem os eixos do sprite?
• Ao desenhar o sprite, são eles que valem!
![Page 55: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/55.jpg)
Desenhando em ActionScript 3 • Onde está o centro de rotação agora?
• Experimente!
![Page 56: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/56.jpg)
Desenhando em ActionScript 3 • Observe como desenhamos...
![Page 57: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/57.jpg)
Desenhando em ActionScript 3 • Compare
![Page 58: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/58.jpg)
ATIVIDADE
![Page 59: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/59.jpg)
Atividade
• Faça um programa que mostre 1 círculo verde de raio 20 pixels
![Page 60: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/60.jpg)
Atividade
• Faça um programa que mostre 1 círculo verde de raio 20 pixels
• Experimente alterar os atributos width e height do círculo... Veja o que acontece!
![Page 61: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/61.jpg)
Atividade
• Faça um programa que mostre 1 retângulo vermelho com 50 x 20 pixels
![Page 62: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/62.jpg)
Atividade
• Faça um programa que mostre 1 retângulo vermelho com 50 x 20 pixels e o incline em 45 graus
![Page 63: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/63.jpg)
LÓGICA E LAÇOS
![Page 64: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/64.jpg)
Logica e Laços em ActionScript 3 • As estruturas de decisão são idênticas ao C
• Experimente!
![Page 65: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/65.jpg)
Logica e Laços em ActionScript 3 • Para brincar com “if”, vamos gerar números
aleatórios?
• Execute várias vezes... O que acontece?
![Page 66: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/66.jpg)
Logica e Laços em ActionScript 3 • Estruturas de repetição são iguais às em C
• Experimente!
![Page 67: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/67.jpg)
Logica e Laços em ActionScript 3 • Usando para desenho...
• Experimente!
![Page 68: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/68.jpg)
Logica e Laços em ActionScript 3 • Vamos juntar tudo, agora...
![Page 69: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/69.jpg)
ATIVIDADE
![Page 70: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/70.jpg)
Atividade
• Faça um programa que mostre 9 retângulos vermelhos 50 x 20 pixels da seguinte forma
![Page 71: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/71.jpg)
Atividade
• Faça com que cada retângulo esteja inclinado em 10, 20, 30, ..., 80, 90 graus
![Page 72: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/72.jpg)
FUNÇÕES EM ACTIONSCRIPT 3
![Page 73: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/73.jpg)
Funções em ActionScript 3 • As funções são parecidas com C
• Experimente!
![Page 74: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/74.jpg)
Funções em ActionScript 3 • As funções são parecidas com JavaScript
• Experimente!
O tipo de retorno vem depois do
nome da função
![Page 75: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/75.jpg)
Funções em ActionScript 3 • Função com parâmetros são mais úteis:
• Experimente!
![Page 76: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/76.jpg)
Funções em ActionScript 3 • Misturando tudo...
• Experimente!
![Page 77: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/77.jpg)
ATIVIDADE
![Page 78: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/78.jpg)
Atividade
• Faça uma função que receba x, y, lado, cor1 e cor2 e desenhe:
cor1
cor2
![Page 79: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/79.jpg)
Atividade • Use a função, com dois “for”, para desenhar:
![Page 80: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/80.jpg)
CONCLUSÕES
![Page 81: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/81.jpg)
Resumo • O ActionScript 3 é uma linguagem similar ao
JavaScript/C
• Há uma grande facilidade em trabalhar com formas geométricas
• A interface do Flash é prática para o desenvolvimento de aplicações AS3
• TAREFA
– Trabalho B!
![Page 82: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/82.jpg)
PERGUNTAS?
![Page 83: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/83.jpg)
Próxima Aula
• AS3 parece legal...
–Mas como interagir com o programa?
–Como fazer animações?
![Page 84: PROGRAMAÇÃO PARA INTERNET ICA - WordPress.comPROGRAMAÇÃO PARA INTERNET RICA Prof. Dr. Daniel Caetano 2012 - 1 INTRODUÇÃO AO ACTIONSCRIPT 3](https://reader034.vdocuments.pub/reader034/viewer/2022042402/5f11ee74350de4058d5fc09a/html5/thumbnails/84.jpg)
BOM DESCANSO A TODOS!