Solucionado
Gostaria de entender o porquê do precisarmos diminuir o raio da bolinha ao invés de aumenta-lo, e por que adicionamos a altura da raquete na verificação de colisão da parte de cima, mas não na de baixo da raquete.
Segue o código abaixo para contextualiza-los:
function colisãoDaRaquete() {
if (
xBola - raio < xRaquete + larguraRaquete &&
yBola - raio < yRaquete + alturaRaquete &&
yBola - raio > yRaquete
) {
velocidadeXBola *= -1;
}
}
Olá Yan!! Considere que vc está no meio do canvas. Se vc caminha em direção ao zero, o que acontece com a distância? Aumenta ou diminui? E quando vc caminha em direção contrária ? Veja que quando a bolinha vai em direção ao zero de qualquer eixo (X ou Y), vc deve subtrair. Pra vc chegar ao zero vc tem que subtrair a distância entre vc e o zero. Agora pra vc ficar distante do zero, vc tem que somar as distancias, quanto mais longe, mais vc deve somar. A bolinha quando vai para a esquerda do canvas, vc deve subtrair o raio para que o x da bolinha fique na borda da bolinha e assim aconteça a colisão. Se não fosse assim, metade da bolinha não teria efeito algum na colisão. Se a bolinha vai para a direita, vc soma o raio dela, pq se não, aconteceria o mesmo. Veja que no lado esquerdo do canvas, a minhaRaquete soma o x da Raquete com sua largura. Isso porque o ponto x da raquete fica do lado esquerdo, é o lado oposto em que a bolinha toca, e para o ponto x da raquete vir para o outro lado e colidir com a bolinha, vc deve somar xRaquete com sua largura. O interessante é que como o x da raquete fica na lateral esquerda da raquete, a raquete do oponente não precisa somar com largura da raquete. Isso porque o x da raquete do oponente já está no lado em que a bolinha vai colidir. Percebe?? O x e y da bolinha ficam no meio dela, e por isso se ela caminhar sentido ao zero (pra cima e para esquerda) , subtraímos o raio. E se ela caminhar para longe do zero (direita e para baixo) vc deve somar o raio.
Enfim, o ponto y da raquete fica na parte superior da raquete, se a bolinha bater na parte de cima da raquete ok, mas se a bolinha bater na parte de baixo da raquete o y da raquete tem que somara altura da raquete para ficar na outra extremidade e assim fazer a colisão!! Espero ter deixado alguma luz!!!!!!!!!!!!! Fique atento ao código que vc postou, a terceira linha do IF é soma do raio e não subtração!! Bons estudos!!!!
Muitissimo obrigado!! Realmente, quando eu tirei a subtração da altura da raquete pra testar meu código, percebi que ela só rebatia na parte de cima, e agora eu entendo o porquê. Novamente, muito obrigado!