1
resposta

[Dúvida] Colisão requete oponente

Não estou conseguindo verificar o toque na raquete do oponente.


let xBolinha = 300;
let yBolinha = 200;
let diametro = 15;
let raio = diametro /2;

let velocidadeXBolinha = 2;
let velocidadeYBolinha = 2;

//variáveis raquete

let xRaquete = 5;
let yRaquete = 150;
let raqueteComprimento = 10;
let raqueteAltura = 90;

//variáveis do oponente
let xRaqueteOponente = 585;
let yRaqueteOponente = 150;
let velocidadeYOponente;

function setup() {
    createCanvas(600, 400);
}

function draw() {
    background(0);
    mostraBolinha();
    movimentaBolinha();
    verificaColisaoBorda();
    mostraRaquete(xRaquete, yRaquete);
    movimentaMinhaRaquete();
    verificaColisaoRaquete ();
    mostraRaquete(xRaqueteOponente, yRaqueteOponente);
    movimentaRaqueteOponente ();
    verificaColisaoRaqueteOponente ();


}
 function mostraBolinha(){
   circle(xBolinha, yBolinha, diametro)
 }
function movimentaBolinha() {

  xBolinha += velocidadeXBolinha;
  yBolinha += velocidadeYBolinha;
}
 function verificaColisaoBorda(){

    if (xBolinha + raio > width || xBolinha - raio < 0) {
        velocidadeXBolinha *= -1;
    }

    if (yBolinha + raio> height || yBolinha - raio < 0) { //verifica se a bolinha chegou na maregem superior e inferior
        velocidadeYBolinha *= -1; //inversão da bolinba
    }
}
function mostraRaquete(x,y) {
    rect(x, y, raqueteComprimento, raqueteAltura);
}

function movimentaMinhaRaquete() {
    if (keyIsDown(UP_ARROW)) {
        yRaquete -= 10;
    }
    if (keyIsDown(DOWN_ARROW)) {
        yRaquete += 10;
    }
}
function verificaColisaoRaquete() {

  if (xBolinha - raio < xRaquete + raqueteComprimento && yBolinha - raio < yRaquete + raqueteAltura && yBolinha + raio > yRaquete){
    velocidadeXBolinha *= -1;

  }
}


function verificaColisaoRaqueteOponente() {

  if (xBolinha - raio < yRaqueteOponente + raqueteComprimento && yBolinha - raio < yRaqueteOponente + raqueteAltura && yBolinha + raio > xRaqueteOponente){
    velocidadeXBolinha *= -1;

  }
}

function movimentaRaqueteOponente() {
    velocidadeYOponente = yBolinha - yRaqueteOponente - raqueteComprimento / 2 - 30;
    yRaqueteOponente += velocidadeYOponente
}
1 resposta

Fala Claudio! Tudo certo por aí?

Veja as alterações que fiz na função verificaColisaoRaqueteOponente():

function verificaColisaoRaqueteOponente() {

  if (xBolinha + diametro > xRaqueteOponente + raqueteComprimento && yBolinha - raio < yRaqueteOponente + raqueteAltura && yBolinha + raio > yRaqueteOponente){
    velocidadeXBolinha *= -1;
  }
}

Na primeira parte que está dentro do if, xBolinha + diametro > xRaqueteOponente + raqueteComprimento, adicionei o valor do diâmetro e inverti o sinal de comparação para maior ( > ).

Utilizei o diâmetro, e não o raio, pois nesse caso a colisão ficou melhor definida com esse valor.

As mudanças na operação se devem à posição que estamos procurando dentro do plano cartesiano do p5. Na função verificaColisaoRaquete() os valores da raquete estão à esquerda e, portanto, são menores. Ao analisar a colisão com a raquete que está mais a direita, os valores serão maiores.

Também mudei a última variável para yRaqueteOponente.

Vou deixar aqui um artigo que fala melhor sobre como funciona o plano cartesiano no p5.js.

Caso tenha ficado alguma dúvida, estou à disposição.

Teste fazer essas alterações na função e me conte se deu certo!

Forte abraço.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!