2
respostas

bolinha nao colide com raquete e fica louca

0boa noite, segui todo passo a passo, mas a bolinha n esta colidindo com a raquete, segue codigo

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

//variaveisdavelocidade
let velocidadexBolinha = 2
let velocidadeyBolinha = 2

//variaveisdaRaquete
  let xRaquete = 150
  let yRaquete = 5

//comprimentoraquete
  let alturaRaquete = 20
  let comprimentoRaquete = 80


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

function draw() {
  background(0);
  mostraBolinha();
  eixox();
  verificaColisaoBorda();
  mostraRaquete();
  movimentaMinhaRaquete();
  verificaColisaoRaquete();

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

  function eixox(){
    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 (){
      rect(yRaquete, xRaquete, alturaRaquete, comprimentoRaquete);
    }

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

    function verificaColisaoRaquete(){
      if (xBolinha - raio < xRaquete + comprimentoRaquete
      && yBolinha - raio < yRaquete + alturaRaquete                         && yBolinha + raio > yRaquete)
    velocidadexBolinha *= -1;
    }
2 respostas

Olá Byron, tudo bem?

Pelo que pude perceber em seu código, a colisão com a raquete não está ocorrendo porque há um erro na função verificaColisaoRaquete(). Acredito que o problema esteja na condição do if.

Tente substituir a condição atual por esta:

if (xBolinha - raio < xRaquete + comprimentoRaquete &&
    xBolinha + raio > xRaquete &&
    yBolinha - raio < yRaquete + alturaRaquete &&
    yBolinha + raio > yRaquete) {
    velocidadexBolinha *= -1;
}

Dessa forma, a colisão deve ocorrer adequadamente. Bons estudos!

boa tarde, nao deu certo, copiado e colado esse codigo, tem parte que a bolinha sobe no meio da tela segue codigo completo, e segue link do p5js

https://editor.p5js.org/byronjau/full/qY7mA_eJw

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

//variaveisdavelocidade
let velocidadexBolinha = 2
let velocidadeyBolinha = 2

//variaveisdaRaquete
  let xRaquete = 150
  let yRaquete = 5
  let raqueteComprimento = 20
  let raqueteAltura = 80
  

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

function draw() {
  background(0);
  mostraBolinha();
  movimentaBolinha();
  verificaColisaoBorda();
  mostraRaquete();
  movimentaMinhaRaquete();
  verificaColisaoRaquete();


  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 (){
      rect(yRaquete, xRaquete, raqueteComprimento, raqueteAltura);
    }
  
    function movimentaMinhaRaquete(){
    if (keyIsDown(UP_ARROW))
      xRaquete -= 10;
      }
    if (keyIsDown(DOWN_ARROW))
      xRaquete += 10;
    }
    
    function verificaColisaoRaquete(){
    if (xBolinha - raio < xRaquete + raqueteComprimento &&
    xBolinha + raio > xRaquete &&
    yBolinha - raio < yRaquete + raqueteAltura &&
    yBolinha + raio > yRaquete)
    velocidadexBolinha *= -1;
}