Matemática no Flash

math

Olá pessoal. Finalmente chegou a hora de vocês usarem seus conhecimentos do ginásio. Vocês sempre ouviram dizer que quem faz informática precisa saber matemática, bem se até hoje ainda não encontrou utilidade para ela, não se preocupe, hoje estarei estreando mais uma seqüência de tutoriais que mostrarão que a matemática é uma poderosa ferramenta para criação de jogos, menus interativos, aplicativos gráficos entre outra utilidade. O foco do nosso primeiro tutorial de matemática com actionscript será o movimento de translação.

01o_plano_cartesiano_img_5

Este é o plano cartesiano da matemática conceitual, no flash trabalhamos quase que exatamente igual com exceção que o eixo y é invertido, ao aumentarmos o valor de y a imagem segue para baixo.

Translação:

Para quem não se lembra, translação é o movimento que a terra faz em torno do sol. Resumindo , é quando um objeto circula um eixo sempre mantendo a mesma distância (raio).

translacao

Você com certeza já viram este recurso sendo usado em alguns jogos, assim como uma bola de fogo, bola de espinhos ou uma plataforma dinâmica. Para reproduzirmos este movimento precisamos relembrar alguns conceitos básicos de trigonometria.

math03

Como podemos ver no circulo trigonométrico a distancia oposta ao angulo é o Cosseno vezes o raio e a distancia adjacente é igual ao seno vezes o raio, Porem no actionscript o angulo deve ser escrito em Radianos vamos analisar a figura e ver como ficaria a posição dos objetos.

math04

Para efetuar o movimento de translação é necessário sempre estar incrementando o angulo por intermédio de enterframe ou timeout. Agora vamos seguir com o nosso exemplo pratico.

Iremos utilizar a linguagem estruturada em nosso exemplo, teremos apenas um arquivo .fla e já teremos um objeto que rotacionará o centro do palco, este objeto terá o nome de “ob”. No primeiro frame escreveremos o seguinte código.

No código a seguir utilizamos os seguintes métodos da classe Math:

Math.cos(n:Number): retorna o cosseno do ângulo.
Math.sin(n:Number): retorna o seno do ângulo.
Math.PI: constante que retorna o PI, PI é a representação gráfica de 180 em radianos.

Em nosso código o objeto ficará circulando o centro com um raio de 100px e a cada passada pelo loop de enterframe o angulo final receberá um ingremento de 2°.  O centro da circunferência será definido no final da equação. Adicionando o respectivo posicionamento do centro após a equação.

var angulo:Number = Math.PI/90;
var newAngulo:Number = 0;

addEventListener(Event.ENTER_FRAME,EnterFrame);

function EnterFrame(e:Event) {
	newAngulo += angulo;
	ob.x = Math.cos(newAngulo) * 100 + stage.stageWidth/2;
	ob.y = Math.sin(newAngulo) * 100 + stage.stageWidth/2;
}

Desculpe pela demora na postagem de um novo tutorial,  meu computador estava com problema e eu estava super atarefado no trabalho. Mas podem deixar que tentarei voltar a periodicidade^^ abraços.

Anúncios

Tags: , , , , , ,

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s


%d blogueiros gostam disto: