Olá, Boa tarde! Gostaria de ajuda para resolver esse Bug. Estou fazendo o código sem o uso da biblioteca, e a bolinha não está colidindo. Fico no aguardo para obter respostas.
Meu código: https://editor.p5js.org/gabeshonorato65/sketches/zSMu_GBfO
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Olá, Boa tarde! Gostaria de ajuda para resolver esse Bug. Estou fazendo o código sem o uso da biblioteca, e a bolinha não está colidindo. Fico no aguardo para obter respostas.
Meu código: https://editor.p5js.org/gabeshonorato65/sketches/zSMu_GBfO
Oii, tudo bem por aí?
Para considerar a colisão da bolinha com a raquete do oponente sem o uso da biblioteca, precisamos criar outra função. Isso se faz necessário por estamos trabalhando no plano cartesiano e os cálculos envolvidos na função tem como retorno valores que significam um lugar específico dentro do canva. Veja esse trecho de código com as duas funções:
function verificaColisaoRaquete() {
if (xBolinha - raio < xRaquete + raqueteComprimento
&& yBolinha - raio < yRaquete + raqueteAltura
&& yBolinha + raio > yRaquete) {
velocidadeXBolinha *= -1;
}
}
function verificaColisaoOponente(){
if (xBolinha + raio > xRaqueteOponente - raqueteComprimento
&& yBolinha - raio < yRaquete + raqueteAltura
&& yBolinha + raio > yRaquete) {
velocidadeXBolinha *= -1;
}
}Percebe que a primeira condição, que verifica o valor de x, está com operadores diferentes?
Quando temos xBolinha - raio < xRaquete + raqueteComprimento, como em verificaColisaoRaquete, o retorno será a colisão da parte esquerda da bolinha com a parte direita da raquete. Quando se trata da colisão com o oponente, buscamos o valor que seja o ponto de encontro entre a parte direita da bolinha com a parte esquerda da raquete. Por isso xBolinha + raio > xRaqueteOponente - raqueteComprimento.
Lembre-se de retirar os parâmetros e chamar a nova função no draw()!
Vou deixar aqui um artigo bem legal que fala sobre como funciona o plano cartesiano no P5.JS e que pode ajudar a compreender como funcionam esses cálculos condicionais:
Forte abraço!