Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
/applications/core/interface/imageproxy/imageproxy.php?img=http://andersonferminiano.com/html5/studies/balls_collisions/balls_collisions.jpg&key=7eac8b566cf78249eac48074a8e7580ff44505f244170043c1b762ab63dce766" alt="balls_collisions.jpg" />
Colisão sem dúvida é umas das partes mais discutidas na área de desenvolvimento de jogos, infelizmente ou felizmente (rsrs) o HTML5 não possui métodos nativos que ajudam nessa parte, ou você trabalha com tile collisions, ou parte para física e matemática de cálculo entre distâncias.
Trouxe uma solução matemática para colisões entre círculos com explicação e código fonte, segue o exemplo:
http://andersonferminiano.com/html5/studies/balls_collisions/
Veja também a explicação da fórmula em inglês:
/applications/core/interface/imageproxy/imageproxy.php?img=http://andersonferminiano.com/html5/studies/balls_collisions/balls_collision_formula.jpg&key=4aaa043968d1f73b46d32384d82d1b82de4b56b2a9eb124036e6d0d686430878" alt="balls_collision_formula.jpg" />
Olá, Anderson!!!
Acessei com o firefox e chrome(o mais recente)e em ambos achei um bug...
Antes mesmo das bolinhas se colidirem, o código está detectando como se já tivessem colidido. A distância em que estão pausando entre si é um tanto grande(algo em torno de 4 ou 5pxs)... Em outros casos o código está detectando a colisão depois de já terem colidido(diferença de aproximadamente de 3px). Não sei se mais alguém conseguiu visualizar isso, mas a iniciativa é boa...
Parabéns!!
EDIT
Aqui um print para você conferir /applications/core/interface/imageproxy/imageproxy.php?img=http://img651.imageshack.us/img651/5618/colisao.jpg&key=c806c1082c651e0a1c633342b0f7d53b4f1086b4a93548f12f8af4ed492104fd" alt="colisao.jpg" />
@Mário
No começo é relativamente complicado se adequar a área de desenvolvimento de jogos, depois acostuma e fica normal rs
@Roger
É, algumas bolinhas, principalmente as pequenas tão colidindo um pouco longe (2px +/-), as médias/grandes parece normal pela imagem...
O certo na verdade é adicionar uma distância um pouco menor pra colidir, alterando na fórmula, subtraindo 1~2 pixels para evitar erros de cálculo como estes.
Testei nas versões mais atualizadas de Chrome, Opera, Safari e Mozilla utilizando Win XP, Seven e Mac OS X Snow Leopard.
Valeu :)
Programação para jogos é fascinante mesmo
quem ver aqueles jogos prontos nem imagina o que tem por tras