Webly: Criando Olhos Que Seguem O Mouse - Webly

Ir para

IMPORTANTE: Todos os tutoriais postados neste fórum irão automaticamente para o portal Webly. Contribua você também e faça parte da equipe de colaboradores que fazem a evolução da web. Obrigado.


Página 1 de 1

Criando Olhos Que Seguem O Mouse Um pouquinho de matemática e nada mais....heheh Avaliar tópico: ***** 1 Votos

#1 Membro offline   MattheusRoriz Ícone

  • Ícone
  • Grupo: Membros
  • Posts: 7
  • Cadastrado: 17-outubro 07

Postou 17 outubro 2007 - 07:50

Sem enrolação vamos direto ao trabalho.



Crie 3 camadas(layers):

1ª Actions

2ª Olhos

3ª Face

Primeiro selecione o olho esquerdo, e instancie como "olho", então selecione o olho direito e instancie como "olho2". Agora iremos criar um script que faça com que os olhos sigam o mouse. Obviamente, esse script necessitará calcular a todo momento aonde o mouse está no stage para olhar na direção correta, mas calma isso é fácil, você verá. Por está razão, no segundo frame da camada Actions, crie um keyframe e insira a seguinte ação:
gotoAndPlay(1);

Isto fará com que o movie fique sempre rodando, ou seja as ações no frame 1 ficarão sempre rodando.

IDÉIA BÁSICA

Bem, a idéia básica que teremos é calcular o ângulo da posição do olho até a posição do mouse e então rotacionar o olho por esse ângulo. E para isso nós iremos tirar os livros de trigonometria do armário e dar uma olhadinha!!!! Sacanagem, eu já fiz isso pra você.

Se tanA=a/b, então A = tan-1(a/B). Bem, os caras da Macromedia também são bons em matemática, por isso eles já facilitaram nossas vidas com algumas funções para nossa questão. Para calcular A, deveremos pegar as distâncias a e b, para isso insira o seguinte código no frame 1 de nosso filme:
a = olho._y-_mouse;
b = olho._x-_mouse;

Agora, para tornamos estas distâncias no ângulo A usaremos este código:
anguloA = Math.atan2(a,b);

O único problema é que assim estaremos pegando as distâncias do ângulo em radianos não em graus, que nada mais é do que uma outra forma de se medir ângulos. Para converter o ângulo A em graus usaremos essa linha:

graus = anguloA/(math.pi/180);

setProperty ("olho", _rotation, graus);

Agora teste seu filme, teoricamente o olho esquerdo deverá seguir o mouse. Estando tudo certo, faça uma cópia e cole na área de script do olho direito, mas lembre-se de mudar o nome das variáveis usadas, pois senão você terá erros de conflito. Lembre-se, esses códigos vão no primeiro frame da camada Actions!!!!! Finalmente, o código completo para os dois olhos será assim:
a = olho._y-_ymouse;
b = olho._x-_xmouse;
anguloAA = Math.atan2(a, b);
graus = anguloA/(Math.pi/180);
setProperty ("olho", _rotation, graus);
a2 = olho2._y-_ymouse;
b2 = olho2._x-_xmouse;
anguloA2 = Math.atan2(a2, b2);
graus2 = anguloA2/(Math.pi/180);
setProperty ("olho2", _rotation, graus2);

Lembres-se também de criar olhos com pulilas para você poder ver o movimento!!!!

Bem pessoal é isso, espero ter ajudado...Estudem e modifiquem à vontade!!!!

Patrocinado pelo Google AdSense, ajude-me a comer.....hehe


0

Página 1 de 1


Resposta rápida

  

1 usuário(s) está(ão) lendo este tópico
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)