1
resposta

[Dúvida] Não consigo resolver esse erro na hora de colocar colisão na raquete do oponente.

//Dados da Bola
let xBola = 275;
let yBola = 215;
let diametro = 25;
let raio = diametro / 2;

//Velocidade da Bola
let velocidadeXbola = 6;
let velocidadeYbola = 6;

//Dados da Raquete
let xRaquete = 5;
let yRaquete = 170;
let raqueteLargura = 10;
let raqueteAltura = 90;

//Dados da Raquete Oponente
let xRaqueteOponente = 535;
let yRaqueteOponente = 170;
let velocidadeYOponente;

function setup(){
  createCanvas(550, 450);
}

function draw(){
  background(0);
  circulo();
  movimentação();
  colisão();
  raquete(xRaquete, yRaquete);
  raquete(xRaqueteOponente, yRaqueteOponente);
  movimentoRaquete();
  movimentoRaqueteOponente();
  colisaoRaquete();
  colisaoRaqueteOponente();
}

function circulo(){
  circle (xBola, yBola, diametro);

}

function raquete(x, y){
  rect (x, y, raqueteLargura, raqueteAltura);

}

function movimentação(){
  xBola += velocidadeXbola;
  yBola += velocidadeYbola;
}

function colisão(){
  if (xBola > width ||
     xBola < 0){
     velocidadeXbola *= -1;
  }

  if (yBola > height ||
     yBola < 0){
     velocidadeYbola *=-1;
  }
}

function movimentoRaquete(){

  if (keyIsDown(UP_ARROW)){
    yRaquete += -5;

  }

  if (keyIsDown(DOWN_ARROW)){
    yRaquete -= -5;

  }

}

function movimentoRaqueteOponente(){
  velocidadeYOponente = yBola - yRaqueteOponente - raqueteLargura / 2 - 30;
  yRaqueteOponente += velocidadeYOponente;
}


function colisaoRaquete(){


  if (xBola - raio < xRaquete + raqueteLargura && yBola - raio < yRaquete + raqueteAltura && yBola + raio > yRaquete){

    velocidadeXbola *= -1;

  }

}

function colisaoRaqueteOponente(){

  if (xBola - raio < xRaqueteOponente + raqueteLargura && yBola - raio < yRaqueteOponente + raqueteAltura && yBola + raio > yRaqueteOponente){

    velocidadeXbola *= -1;

  }

}

Bola fica travada no centro da tela

1 resposta

Olá, Ricardo! Tudo bem?

Antes de tudo, agradeço a paciência em aguardar uma resposta.

Na estrutura if , presente na função colisaoRaqueteOponente() , está faltando uma condição para verificar se a soma entre xBola e raio é superior a xRaqueteOponente . Após adicionarmos esta verificação, chegamos no resultado abaixo:

function colisaoRaqueteOponente(){
  if (xBola + raio > xRaqueteOponente && xBola - raio < xRaqueteOponente + raqueteLargura && yBola - raio < yRaqueteOponente + raqueteAltura && yBola + raio > yRaqueteOponente){
    velocidadeXbola *= -1;
  }
}

Ao lermos as verificações presentes na condicional, podemos sentir um pouco de dificuldade em reconhecer cada uma delas. Isso é super comum quando estamos lidando com várias análises ao mesmo tempo.

Uma dica super legal para melhorar a visibilidade do nosso código, é realizar quebras de linha em pontos específicos. Se aplicarmos essa ideia no if da função colisaoRaqueteOponente(), teremos algo assim:

function colisaoRaqueteOponente(){

  if (xBola + raio > xRaqueteOponente && 
      xBola - raio < xRaqueteOponente + raqueteLargura && 
      yBola - raio < yRaqueteOponente + raqueteAltura && 
      yBola + raio > yRaqueteOponente){

    velocidadeXbola *= -1;
  }
}

Notou a diferença? Toda vez que uma verificação é finalizada, utilizamos o operador lógico && (que significa “e”) para iniciar a próxima. Depois disso, usa-se a tecla ENTER a fim de pular para a próxima linha. Agora fica muito mais fácil visualizar cada condição, não acha?

Por fim, para somar aos seus estudos, deixo aqui uma dica de leitura. O artigo abaixo comenta sobre um ponto muito importante no desenvolvimento de programas, a padronização de nomenclaturas!

Caso surjam dúvidas ao decorrer dos seus estudos, sinta-se confortável para enviá-las no fórum. Ficarei feliz em te ajudar!

Abraços, Ricardo!

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