Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Bolinha não colide com a raquete

Revisei o código com o do professor, olhei no fórum pra ver se tinha deixado passar algo mas não encontro o erro.

A bolinha colide na borda da tela mas não colide com a raquete, como resolver?

Segue meu código abaixo e imagem da bolinha atravessando a raquete:

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

//velocidade da bolinha let velocidadexBolinha = 2; let velocidadeyBolinha = 2;

//variaveis da raquete let xRaquete = 5; let yRaquete = 150; let raqueteComprimento = 10; let raqueteAltura = 90;

width = 600; heigth= 400;

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

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

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

function movimentaBolinha(){ xBolinha += velocidadexBolinha; //yBolinha += velocidadeyBolinha; }

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

  if (yBolinha + raio > heigth || yBolinha - raio < 0){
  velocidadeyBolinha *= -1;
  }

}

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

bolinha atravessando raquete

4 respostas

Bom dia Jairo!

Copia a URL do teu projeto e cola aqui, fica mais fácil de te ajudar.

Bom dia Arnaldo,

Segue a URL: https://editor.p5js.org/AkaJarius/sketches/4QJ6ZWy2h

solução!

Jairo, encontrei alguns erros no seu código. O primeiro é que você está utilizando a variável velocidadexBolinha com x minúsculo em vários lugares, e você a declarou velocidadeXBolinha com X maiúsculo. E a função verificaColisaoRaquete() precisa ser chamada dentro da função draw() assim como todas as outras que já estão la.

Aqui está seu código corrigido e funcionando:

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

//velocidade da bolinha
let velocidadeXBolinha = 2;
let velocidadeyBolinha = 2;

//variaveis da raquete
let xRaquete = 5;
let yRaquete = 150;
let raqueteComprimento = 10;
let raqueteAltura = 90;

width = 600;
heigth= 400;

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

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

    }

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

function movimentaBolinha(){
  xBolinha += velocidadeXBolinha;
  //yBolinha += velocidadeyBolinha;
}

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

      if (yBolinha + raio > heigth || yBolinha - raio < 0){
      velocidadeyBolinha *= -1;
      }
}

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

Espero ter ajudado. Se isso resolver seu problema, não esquece de marcar a resposta como solução :D

Boa tarde Arnaldo,

Deu certo, muito obrigado!

Porém devo ressaltar que fiz exatamente conforme o professor informou na aula, se você der uma olhada, no código dele está X maiúsculo e ele não tinha incluído verificaColisaoRaquete() dentro da função draw(), pelo menos nesta aula/vídeo, então para não ter nenhum problema eu coloquei aqui no fórum exatamente como estava na aula.

Seria uma boa revisarem essas aulas e atualizar se for o caso, mas enfim, agradeço novamente pela ajuda!!