2
respostas

bug na raquete do oponente

bom dia. depois que adicionei a funcao chance de errar, a raquete do oponente começou a apresentar problemas graficos como se estivesse sumindo

https://editor.p5js.org/Murilofreitas/sketches/3mJipxIfK

2 respostas

Olá Murilo!

Para resolvermos isso basta alterar a sua função, movimentaRaqueteoponente retirando alguns comandos como o constrain, que fica renderizando a raqueta a cada execução da função, dando esse efeito "fantasma", seu código deve ficar assim:

function movimentaRaqueteoponente(){
  velocidadeYOponente = yBolinha - yRaqueteoponente - raqueteComprimento / 2 - 30;
  yRaqueteoponente += velocidadeYOponente + chanceDeErrar
  calculaChanceDeErrar()
}

Quando mudarmos, esses valores a bolinha vai ter seu ponto de saída junto com o da raquete gerando um bug, para reparar esse bug basta aumentar o xBolinha, para o valor 500, seu código completo fica assim:

//variáveis da bolinha
let xBolinha = 500;
let yBolinha = 200;
let diametro = 13;
let raio = diametro / 2 ;

//velocidade da bolinha
let velocidadeXBolinha = 3;
let velocidadeYBolinha = 3;


//variáveis da raquete
let xRaquete = 5;
let yRaquete = 150;
let raqueteComprimento = 10;
let raqueteAltura = 90;
let colidiu = false;

///variáveis da raquete oponente

let xRaqueteoponente = 585;
let yRaqueteoponente = 150;
let velocidadeYOponente;
   
// placar do jogo

let meusPontos = 0;
let pontosOponente = 0;
let pontoMarcado = false

// placar do jogo

let raquetada;
let ponto;
let trilha;

//chance de errar;
let chanceDeErrar = 0

function preload(){
  
  trilha = loadSound("trilha.mp3")
  ponto = loadSound("ponto.mp3")
  raquetada= loadSound("raquetada.mp3")
}


function setup() {
  createCanvas(600, 400);
  trilha.loop(); 
}

function draw() {
  background(0);
  mostraBolinha();
  movimentaBolinha();
  verificaColisaoBorda();
  mostraRaquete(xRaquete, yRaquete);
  movimentaMinhaRaquete();
  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 bolinhaNaoFicaPresa(){
    if (XBolinha - raio < 0){
    XBolinha = 23
    }
}
function mostraRaquete(x , y){
  rect(x, y, raqueteComprimento, 
      raqueteAltura);
}



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

function verificaColisaoRaquete(){
  if (xBolinha - raio < xRaquete + raqueteComprimento && 
      yBolinha - raio < yRaquete + raqueteAltura && 
      yBolinha + raio > yRaquete){
    velocidadeXBolinha *= -1;
  raquetada.play()}
  
}
function  verificaColisaoRaquete(x, y){
  colidiu = 
  collideRectCircle(x, y, raqueteComprimento,raqueteAltura, xBolinha, yBolinha, raio);
  if (colidiu){velocidadeXBolinha *= -1;
              raquetada.play(
              )}
}
function calculaChanceDeErrar() {
  if (pontosOponente >= meusPontos) {
    chanceDeErrar += 1
    if (chanceDeErrar >= 39){
    chanceDeErrar = 40
    }
  } else {
    chanceDeErrar -= 1
    if (chanceDeErrar <= 35){
    chanceDeErrar = 35
    }
  }
}

function movimentaRaqueteoponente(){
  velocidadeYOponente = yBolinha - yRaqueteoponente - raqueteComprimento / 2 - 30;
  yRaqueteoponente += velocidadeYOponente + chanceDeErrar
  calculaChanceDeErrar()
}

function incluiplacar(){
  stroke (255)
  textAlign (CENTER)
  textSize (16)
  fill (color(255, 140 , 0))
  rect (150, 10,40, 20);
  fill (255)
  text (meusPontos, 170, 26 )
  fill (color(255, 140 , 0))
  rect (450, 10,40, 20)
  fill (255)
  text (pontosOponente , 470 , 26)
  
}

function marcaPonto(){
 
  if (xBolinha > 590 && !pontoMarcado) {
    meusPontos += 1;
  ponto.play()
    pontoMarcado = true;
  }
  if (xBolinha < 10 && !pontoMarcado) {
    pontosOponente += 1;
    ponto.play()
  
    pontoMarcado = true;
  }
  
  if (xBolinha > 10 && xBolinha < 590) {
    pontoMarcado = false;
  }
}

Espero ter ajudado e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso

Um grande abraço e até mais!

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

Consegui resolver apenas mudando de posição o funcão constrain

function movimentaRaqueteoponente(){ velocidadeYOponente = yBolinha - yRaqueteoponente - raqueteComprimento / 2 - 30; yRaqueteoponente += velocidadeYOponente; yRaqueteoponente += velocidadeYOponente + chanceDeErrar calculaChanceDeErrar() yRaqueteoponente = constrain (yRaqueteoponente, 10, 300); }