44
Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação de clips em movimentos reproduzindo sons, controle de sons Uso de Bibliotecas, Criando um filme. Detecção de colisões,Criação de Aplicações. e-mail : http://www1.univap.br/~wagner Prof. Responsáveis Wagner Santos C. de Jesus

Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

Embed Size (px)

Citation preview

Page 1: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

Universidade do Vale do ParaíbaColégio Técnico Antônio Teixeira Fernandes

Disciplina Programação Orientada a objetos II.

Material IV-BimestreCriação de clips em movimentos

reproduzindo sons, controle de sons Uso de Bibliotecas, Criando um filme.

Detecção de colisões,Criação de Aplicações.

e-mail : http://www1.univap.br/~wagner

Prof. Responsáveis

Wagner Santos C. de Jesus

Page 2: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

2

Criação de Movimentos

Filme(forma) Evento

Programa(ActionScript)

Animação

Page 3: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

3

gotoAndPlay(): Método que dispara uma seqüência de quadros

Ao criar quadros para uma animação basta usar o método gotoAndPlay() em um evento para disparar uma animação.

Exemplo :

on (press) {

_root.gotoAndPlay (1);

}

Page 4: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

4

Animação por Interpolação

Animação por interpolação em recurso do Que permite que uma figura possa ser posicionada em um local do quadro sem a necessidade ter que mudar de quadro cada posição do objeto será gravada em novo quadrado dando a simulação do movimento.

Page 5: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

5

Exemplo: Interpolador movimento

Basta selecionar a opção marca e realizar deslocamento da figura

Page 6: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

6

Interpoladores

Quadro1 Quadro2 Quadro3

Valores(quadro por segundo)

Page 7: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

7

Passos para criação de animação por Interpolação

1. Selecionar o objeto (figura) que será interpolada.

2. Selecionar ponto preto na linha do tempo.3. Na barra de propriedades escolha interpolação

de movimentos.4. Em seguida selecione a quantidade de

quadros que deseja criar.5. Selecione Inserir Quadros chave.6. Translade a figura para o ponto desejado.7. Selecione CTRL+<ENTER> (Veja a

animação).

Page 8: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

8

Movendo quadros

prevFrame() : Move para quadro anterior.

nextFrame() : Move para o próximo quadro.

Page 9: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

9

Criando um filme

O Flash permite que todas as aplicações de animação confeccionadas possam ser transformadas em filmes; que poderão ser reproduzidos por programas como mediaplayer ou lidos por programas escritos em linguagens de programação como Delphi, C++ e visualBasic e outras.

Page 10: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

10

Criando um filme

Selecione a opção indicada

Page 11: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

11

Determine o nome do filme a ser criado e seu formato

Avi, mov ou outros

Selecione o botão salvar e aguarde.

Page 12: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

12

Feitas as operações anteriores

Atributos do filme normalmente podemos deixar o padrão, caso contrario altere e selecione o botão ok.

Page 13: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

13

Essa opção permite determinar operações de compactação de vídeo ou não

Selecione o botão ok em seguida o vídeo será criado.

Page 14: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

14

Colocando som em uma aplicação

Classe : Sound() permita reprodução de sons pelo AS.

Exemplo da criação de um objeto Sound.

Meu_som = new Sound();

Page 15: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

15

Sound (Reprodução de Sons)

Sound() Biblioteca Arquivo(s)

mp3

wav

......

volume Estéreo

Reprodução

Start()

Page 16: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

16

Método : attachSound()

Determina o arquivo de som da biblioteca que será reproduzido.

Exemplo :

<objSom>.attachSound(String);

Page 17: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

17

Método: setVolume()

Determina a altura do volume a ser reproduzido podendo ser usado um valor de 0 a n.

Exemplo :

<objSom>.setVolume(<expN>);

Page 18: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

18

Método:setPan()

Determina em caso de estéreo se som será emitido no canal esquerdo ou direito, (-100) faz com o som seja emitido no canal esquerdo e (100) emite som apenas o canal direito caso deseje emitir no dois canais basta colocar o parâmetro (0).

Exemplo : <objSom>.setPan(<expN>);

Page 19: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

19

Método : stop()

Para a reprodução do som.

Exemplo : <objSom>.stop();

Page 20: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

20

Exemplo : Sons

on (press) {

som = new Sound();

som.attachSound("musica");

som.setVolume(200);

//som.setPan(100);

som.start();

}

Page 21: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

21

Método : fscommand()

Permite que o filme Flash se comunique com o Flash Player ou com o programa que hospeda o Flash Player, como um navegador da Web. Você também pode usar a ação fscommand para passar mensagens para o Macromedia Director ou para o Visual Basic, Visual C++ e outros programas que possam hospedar controles ActiveX.

Page 22: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

22

Comandos Parâmetros Objetos

quit Nenhum Fecha o projeto

fullscreen true ou false A especificação de true define o Flash Player no modo de tela cheia. A especificação de false faz o exibidor voltar à exibição de menu normal.

showmenu true ou false A especificação de true ativa o conjunto completo de itens do menu de contexto. A especificação de false torna esmaecidos todos os itens do menu de contexto, exceto Sobre o Flash Player.

exec Caminho para o aplicativo Executa um aplicativo no projetor.

Page 23: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

23

Movimento de figuras Transformação Geométrica

Transformação vem a ser o conceito de transladar, atribuir uma escala ou rotação de uma figura.

Page 24: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

24

Par ordenado (_x, _y) para tratar as coordenadas

_x (Coluna)

_y(Linha)

Page 25: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

25

Exemplo : Translação (_x,_y)

on (press) {

_root["quadrado"]._x+=10 ;

}

+-on (press) {

_root["quadrado"]._y+=10 ;

}

+

-

Page 26: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

26

Exemplo : Escala

Propriedades:

_xscale : altera a largura do objeto de um filme.

_yscale : altera a altura do objeto de um filme.

Page 27: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

27

Exemplo de escala

x (Largura)

y (Altura)

Page 28: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

28

Exemplo prático de escala

on (press) {

_root["triangulo"]._xscale+= 100;

_root["triangulo"]._yscale+= 100;

}

Page 29: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

29

Exemplo de rotação

Determina a rotação para um figura usando valores positivos para sentido horário e negativo para sentido anti-horário.

Exemplo : _rotation – valor deverá ser em graus.

Page 30: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

30

Exemplo de rotação

+-

Page 31: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

31

Exemplo prático de rotação

on (press) {

_root["triangulo"]._rotation += 45;

}

Page 32: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

32

Arrastando uma figura com movimentos do mouse

Objeto (figura)

startDrag()

Ativa mouse

Movimentos

stopDrag()

Page 33: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

33

Métodos : startDrag()startDrag(<string>,<booleano>);

String – Determina o nome do clipe que será movimentado em caso de ser o próprio não é necessário informar esse parâmetro.

boolean – Determina o local liberado para arrastar uma figura. Dever ser usado true.

Page 34: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

34

Métodos : stopDrag()

stopDrag() – Interrompe o recurso de arrastar cancelando o método startDrag().

Page 35: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

35

Exemplo prático :

on (press) {

startDrag("",true);

}

on (release) {

stopDrag();

}

Page 36: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

36

Operador this

O operador this assim como o new são operadores reservados do AS, o this permite realizar a referência quando estamos falando do próprio objeto.

Exemplo : _root["quadro2"]._xscale = 200; this._xscale = 200;

Obs: Não precisa fazer referência ao nome do objeto inteiro.

Page 37: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

37

Propriedade : _xmouse e _ymouse

Essas propriedades permitem capturar a posição das coordenadas (x,y); coluna e linha onde o mouse foi passado.

Exemplo:

trace(_root._xmouse);

trace(_root._ymouse);

Page 38: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

38

Arrastando uma figura usando o evento onClipEvent()

onClipEvent (enterFrame) {if(drag) {

this._x = _root._xmouse;this._y = _root._ymouse;

}}

Page 39: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

39

Usando variável drag.

on (press) {

drag = true; // pressionar

}

on (release) {

drag = false; // Soltar

}

Page 40: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

40

Detecção de colisões

Pelas leis da física dois corpos não podem ocupar o mesmo lugar em um espaço; quando esse fenômeno eventualmente ocorre chamamos colisão. Para simularmos computacionalmente a colisão de dois objetos devemos calcular se suas posições em algum ponto são iguais p(x,y) ou os pontos das extremidades dos objeto.

Page 41: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

41

Para realizarmos o teste de uma colisão em AS, devemos usar o método hitTest.

Sintaxe :

this.hitTest(x,y,booleano);

x – posição horizontal y – posição vertical

booleano – formato exato do objeto (true) ou a área retangular do mesmo(false).

Page 42: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

42

Diagrama de colisão

Objeto hitTest (posição do mouse)

this.hitTest (objeto)

Page 43: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

43

Exemplo teste colisão com mouse

onClipEvent (enterFrame) {

if(this.hitTest(_root._xmouse,_root._ymouse,true)) {

this._x = int(Math.random()*550);this._y = int(Math.random()*400);

}

}

Page 44: Universidade do Vale do Paraíba Colégio Técnico Antônio Teixeira Fernandes Disciplina Programação Orientada a objetos II. Material IV-Bimestre Criação

44

Exemplo teste colisão entre objetos

onClipEvent (enterFrame) {

if(_root["q2"].hitTest(_root["q1"])) {

_root.gotoAndPlay(2);

}else

_root["q1"]._x+=5;

}