1
resposta

[Dúvida] Colisão da bolinha com as duas raquetes não ta funcionando

Oi, gostaria de ajuda, pois minha as colisões da bolinha com a minha raquete e a do oponente não estão funcionando. De resto, está tudo funcionando.

//variaveis da bolinha
let xBolinha = 300; 
let yBolinha = 200;
let diametro = 30;
let velocidadeXBolinha = 30

//variaveis da raquete
let xRaquete = 5;
let yRaquete = 150;
let largura = 10;
let altura = 90;
let raqueteComprimento = 100;
let raqueteAltura = 50

//variaveis do oponente
let xRaqueteOponente = 585
let yRaqueteOponente = 150 
let velocidadeYoponente

let colidiu = false

//placar do jogo
let meusPontos = 0;
let pontosOponente = 0;

//velocidade da bolinha
let velocidadexBolinha = 6;
let velocidadeyBolinha = 6;
let raio = diametro / 2;

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

function draw() {
  background(0);
  mostraBolinha ();  
  movimentaBolinha ();
  verificaColisaoBorda ();
  mostraRaquete (xRaquete, yRaquete);
  movimentaMinhaRaquete ();
  //verificaColisaoRaquete ();
  verificaColisaoRaquete (xRaquete, yRaquete);
  mostraRaquete (xRaqueteOponente, yRaqueteOponente);
  movimentaRaqueteOponente ();
  verificaColisaoRaquete (xRaqueteOponente, yRaqueteOponente);
  incluiPlacar ();
  marcaPonto ();
}
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) {
    velocidadeyBolinha *= -1
  }
}

function mostraRaquete (x,y) {
  rect (x, y, largura, altura)
}


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

function movimentaRaqueteOponente () {
  velocidadeYoponente = yBolinha - yRaqueteOponente - raqueteComprimento / 2 - 30;
  yRaqueteOponente += velocidadeYoponente

}

function verificaColisaoRaquete () {
  if (xBolinha - raio < xRaquete + largura && yBolinha - raio < yRaquete + altura && yBolinha + raio > yRaquete) {
    velocidadexBolinha *= -1;
  }
}

function verificaColisaoRaquete (x, y) {
 colidiu = collideRectCircle(x, y, raqueteComprimento, raqueteAltura, xBolinha, yBolinha, raio)
  if (colidiu) {
    velocidadeXBolinha *= -1;
  }
  }

function incluiPlacar () {
  fill (255)
  text (meusPontos, 278, 26 )
  text (pontosOponente, 321, 26 )
}

function marcaPonto(){
  if(xBolinha + raio/2> 592){
    meusPontos += 1
  }
 if(xBolinha - raio /2 < 8){
    pontosOponente += 1
  }
}



https://editor.p5js.org/rayanelopesdj/full/WZ6riZ8br
1 resposta

Olá, Matheus! Tudo bem?

Pode-se observar que a altura e a largura da raquete estão sendo declaradas duas vezes, prejudicando o resultado esperado do código, dessa forma, devemos excluir a declaração das variáveis raqueteComprimento e raqueteAltura e deixar apenas as variáveis largura e altura.

Ademais, pode-se observar que o mesmo ocorre com a velocidade no eixo x da bolinha, que é declarada duas vezes em variáveis diferentes. Assim, devemos excluir a declaração da variável velocidadeXBolinha e deixar apenas a declaração da variável velocidadexBolinha.

Somado a isso, na função verificaColisaoRaquete devemos trocar o comando collideRectCircle(x, y, raqueteComprimento, raqueteAltura, xBolinha, yBolinha, raio) por collideRectCircle(x, y, largura, altura, xBolinha, yBolinha, raio). Assim como devemos trocar o comando velocidadeXBolinha *= -1 por velocidadexBolinha *= -1.

Além disso, devemos alterar dentro da função movimentaRaqueteOponente a variável raqueteComprimento por largura, seguindo a nomenclatura realizada no nosso código.

Após essas alterações o nosso código deverá ficar da seguinte maneira:


//variaveis do oponente
let xRaqueteOponente = 585
let yRaqueteOponente = 150 
let velocidadeYoponente

let colidiu = false

//placar do jogo
let meusPontos = 0;
let pontosOponente = 0;

//velocidade da bolinha
let velocidadexBolinha = 6;
let velocidadeyBolinha = 6;
let raio = diametro / 2;

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

function draw() {
  background(0);
  mostraBolinha ();  
  movimentaBolinha ();
  verificaColisaoBorda ();
  mostraRaquete (xRaquete, yRaquete);
  movimentaMinhaRaquete ();
  //verificaColisaoRaquete ();
  verificaColisaoRaquete (xRaquete, yRaquete);
  mostraRaquete (xRaqueteOponente, yRaqueteOponente);
  movimentaRaqueteOponente ();
  verificaColisaoRaquete (xRaqueteOponente, yRaqueteOponente);
  incluiPlacar ();
  marcaPonto ();
}
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) {
    velocidadeyBolinha *= -1
  }
}

function mostraRaquete (x,y) {
  rect (x, y, largura, altura)
}


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

function movimentaRaqueteOponente () {
  velocidadeYoponente = yBolinha - yRaqueteOponente - largura / 2 - 30;
  yRaqueteOponente += velocidadeYoponente

}

function verificaColisaoRaquete () {
  if (xBolinha - raio < xRaquete + largura && yBolinha - raio < yRaquete + altura && yBolinha + raio > yRaquete) {
    velocidadexBolinha *= -1;
  }
}

function verificaColisaoRaquete (x, y) {
 colidiu = collideRectCircle(x, y, largura, altura, xBolinha, yBolinha, raio)
  if (colidiu) {
    velocidadexBolinha *= -1;
  }
  }

function incluiPlacar () {
  fill (255)
  text (meusPontos, 278, 26 )
  text (pontosOponente, 321, 26 )
}

function marcaPonto(){
  if(xBolinha + raio/2> 592){
    meusPontos += 1
  }
 if(xBolinha - raio /2 < 8){
    pontosOponente += 1
  }
}

Espero ter ajudado na compreensão do problema. Caso tenha ficado alguma dúvida, sinta-se à vontade em comunicar, estou à disposição!

Um forte abraço e bons estudos!

Caso este post tenha te ajudado, por favor, marcar como solucionado ✓