4
respostas

Colisão raquete Oponente sem usar biblioteca

//variáveis da Bolinha
let xBolinha = 300
let yBolinha = 200
let diametro = 20
let raio =  diametro / 2;

//Variáveis da Velocidade da Bolinha
let velocidadeXBolinha = 6
let velocidadeYBolinha = 6

//Váriaveis da Raquete
let xRaquete = 5
let yRaquete = 150
let larguraRaquete = 10
let alturaRaquete = 90

//Variáveis da Raquete do Oponente
let xRaqueteOponente =585
let yRaqueteOponente = 150
let velocidadeYOponente;



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

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

}

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

function mostraRaquete (x,y) {
  rect (x,y,larguraRaquete,alturaRaquete);
 }

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

function movimentaRaqueteOponente (){
  velocidadeYOponente = yBolinha - yRaqueteOponente - larguraRaquete / 2 -30 
  yRaqueteOponente += velocidadeYOponente
}

function verificaColisaoRaquete(){
  if (xBolinha - raio < xRaquete + larguraRaquete && yBolinha - raio < yRaquete + alturaRaquete && yBolinha + raio > yRaquete){
    velocidadeXBolinha *= -1; 
  }
}

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

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

Preciso de ajuda para configurar a colisão com a raquete do Oponente.

Tentei alterar o código

function verificaColisaoRaquete(){ if (xBolinha - raio < xRaqueteOponente + larguraRaquete && yBolinha - raio < yRaqueteOponente + alturaRaquete && yBolinha + raio > yRaqueteOponente){ velocidadeXBolinha *= -1; }

e acabou bugando.

4 respostas

Fala ai Fernandes, tudo bem? Seu código possuí várias dependencias (outros arquivos .js), por conta disso, vou pedir que você compartilhe o link do editor, por favor.

Assim eu consigo simular o problema por aqui e analisá-lo com mais calma.

Fico no aguardo.

https://editor.p5js.org/bgfernandes.negocios/sketches/MqFQI37PD

Segue em anexo o link.

Fala Fernandes, dei uma olhada no seu projeto, vamos as correções:

Sua função para verificar as colisões das raquetes não está completa. mude ela para:

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

Depois, dentro do seu draw, troque a função verificaColisaoRaquetepara verificaColisaoRaquete(xRaquete, yRaquete).

Agora precisamos verificar a colisão da raquete do oponente, adicione a função verificaColisaoRaquete(xRaqueteOponente, yRaqueteOponente) abaixo da função anterior.

Ficando:

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

Por último, você precisa importar a biblioteca p5.collide2d para realizar a verificação da colisão, importe o .js no seu index.html:

<script src="p5.collide2d.js"></script>
<script src="sketch.js"></script>

Acho que com essas alterações o jogo vai funcionar.

Espero ter ajudado.

Eai Fernandes, A solução que desenvolvi foi essa:

` function collideRac2(){

if ( xBall + ray > xRac2 && yBall - ray < yRac2 + h && yBall > yRac2){

speedxBall *= -1

racSound.play();} `