LabMM3 - Aula teórica 15

854 views
795 views

Published on

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
854
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
78
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

LabMM3 - Aula teórica 15

  1. 1. JavaScript:Parte 1: “Road to nowhere”Parte 2: “Kris Kross will make you jump, jump”Carlos SantosLabMM 3 - NTC - DeCA - UAAula 15, 17-11-2011
  2. 2. “Road to nowhere”
  3. 3. Como criar a ilusão de movimento?• Deslocamento deslocamento
  4. 4. Como criar a ilusão de movimento?• Animação sprite 1 sprite 2 sprite 3 sprite 1 ou sprite 4...
  5. 5. Como animar em JavaScript?• Organizar em pastas os sprites de uma animação: • todos os sprites devem ter a mesma dimensão (principalmente se existirem colisões); • animação deve funcionar de um modo natural; • não exagerar no número de passos!• Criar um timer onde: • muda para o sprite seguinte do objeto animado (em ciclo); • desloca o objeto no ecrã.
  6. 6. Como animar em JavaScript?• Podem ser adotadas soluções com 2 timers: • um controla a animação, • outro controla o movimento.• Se o objeto fica parado... • então a animação também deve parar!• Se o objeto faz algo diferente... • então a animação também deve ser diferente!
  7. 7. Exemplo• Objetivos: • objeto a deslocar-se para a direita; • objeto animado com 5 sprites (0..4); • possibilidade de parar o objeto; • inverter a direção quando chega a uma “parede”;
  8. 8. “Kris Kross will make you jump, jump”
  9. 9. Vamos simplificar o salto• As leis da física não se aplicam neste exemplo! • Vamos voltar aos primórdios dos jogos onde não existia gravidade! • O objeto sobe e desce sempre a uma velocidade constante. • O objeto continua com a mesma animação... mesmo durante o salto :)
  10. 10. Descrição do movimento simplicado teto salto ou número de incrementos até ao limite evento “salta”

×