1
resposta

Marcando ponto dos dois lados independente do lado que a bolinha acerta

A princípio, mesmo com o código provocando uma margem de erro para o oponente, ele nunca errava. Buscando no forum, encontrei algumas dicas para melhorar isso. Porém, agora notei, que se eu defendo, o oponente também defende. Se um lado marca ponto, os pontos são contabilizados para ambos. Ou seja, sempre empatado! Segue meu código:

//Variáveis da bolinha
let xBolinha = 300;
let yBolinha = 200;
let diametro = 15;
let raio = diametro / 2;

//Velocidade da bolinha
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

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

//Variáveis do oponente
let xRaqueteOponente = 585; 
let yRaqueteOponente = 150;
let velocidadeYOponente;

let chanceDeErrar = 0;

let colidiu = false;

//Placar do jogo
let meusPontos = 0;
let pontosOponente = 0;


//Sons do jogo
let raquetada;
let ponto;
let trilha;

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


//Tamanho da tela de jogo
function setup() {
  createCanvas(600, 400);
  trilha.loop();
}

//**************Execussão do jogo***************//
function draw() {
  background(0);
  mostraBolinha();
  movimentaBolinha();
  verificaColisaoBorda();  
  mostraRaquete(xRaquete, yRaquete);
  movimentaMinhaRaquete();
  //verificaColisaoRaquete();
  mostraRaquete(xRaqueteOponente, yRaqueteOponente);
  movimentaRaqueteOponente();
  verificaColisaoRaquete(xRaquete, yRaquete);
  verificaColisaoRaquete(xRaqueteOponente, yRaqueteOponente);
  incluiPlacar();
  marcaPonto();
  bolinhaNaoFicaPresa();
  //calculaChanceDeErrar();

}
//**********************************************//




//Funções
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(x, y){
    rect(x, y, raqueteComprimento, raqueteAltura);
}


function movimentaMinhaRaquete(){
  if (keyIsDown(UP_ARROW)){
    yRaquete -= 10;
  }
  if (keyIsDown(DOWN_ARROW)){
    yRaquete += 10;
  }//Inclusão desses dois IFs para evitar que a raquete ultrapasse o canvas
  if(yRaquete > 350){
        yRaquete -= 10;
    }
  if(yRaquete < 0){
        yRaquete +=10;
  }
}

function verificaColisaoRaquete(){
  if (xBolinha - raio < xRaquete + raqueteComprimento && 
      yBolinha - raio < yRaquete + raqueteAltura &&
      yBolinha + raio > yRaquete){
    velocidadeXBolinha *= -1;
    raquetada.play()
  }
}

//Função Alternativa da Biblioteca
function verificaColisaoRaquete(x, y){
  colidiu = 
  collideRectCircle(x, y, raqueteComprimento, raqueteAltura, xBolinha, yBolinha, raio);
  if(colidiu){
    velocidadeXBolinha *= -1
    raquetada.play();
  }
}

//Função movimenta raquete oponente
function movimentaRaqueteOponente(){
  velocidadeYOponente = yBolinha -yRaqueteOponente - raqueteComprimento / 2 - 30;
  yRaqueteOponente += velocidadeYOponente + chanceDeErrar
  calculaChanceDeErrar()
}

function incluiPlacar() {
  stroke(255);
  textSize(16);
  textAlign(CENTER);
  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) {
  meusPontos += 1;
    ponto.play();
}
  if(xBolinha < 10){
  pontosOponente += 1;
    ponto.play();
}
}

//Quando a bolinha fica presa
function bolinhaNaoFicaPresa(){
    if (xBolinha + raio < 0){
    console.log('bolinha ficou presa');
    xBolinha = 300;
    }
}

function calculaChanceDeErrar() {
  if (pontosOponente >= meusPontos) {
    chanceDeErrar += 1
    if (chanceDeErrar >= 39){
    chanceDeErrar = 40
    }
  } else {
    chanceDeErrar -= 1
    if (chanceDeErrar <= 35){
    chanceDeErrar = 35
    }
  }
}
1 resposta

Oi Karen, tudo bem?

Obrigado pela paciência na espera de uma resposta!

Utilizando a proposta de solução de uma outra scuba, percebi que poderíamos aplicar em seu código para que o erro do oponente seja mais conciso.

Primeiramente precisamos alterar algumas partes de seu código:

  • Remover ou comentar tudo que se refere a variávelchancedeerrar e a funçãocalculachandeerrar().

Direto ao assunto, iremos utilizar este trecho de código abaixo:

let direcaoRaqueteOponente = 1;

function movimentaRaqueteOponente(){
  const mediaYBolinha = yBolinha + raio;
  const mediaYRaqueteOponente = yRaqueteOponente + (raqueteAltura/2);

  if (mediaYBolinha > mediaYRaqueteOponente) {
    direcaoRaqueteOponente = 1;
  } else {
    direcaoRaqueteOponente = -1;
  }
  yRaqueteOponente += 6 * random(0.6, 0.95) * direcaoRaqueteOponente;
}

A const é semelhante a let e a var, porém, os dados contidos nela são imutáveis.

Analisando etapa por etapa:

Mudanças fora da função movimentaRaqueteOponente:


  • Criamos a variável direcaoRaqueteOponente. Ela determina se o movimento da raquete é para baixo ou para cima.

Dentro de movimentaRaqueteOponente


const mediaYBolinha = yBolinha + raio;
const mediaYRaqueteOponente = yraqueteoponente + (raquetealtura/2);
  • Criamos a variável mediaYBolinha, que armazena a localização média da bolinha na tela;
  • Foi criada a variável mediaYRaqueteOponente, que armazenará a localização média da raquete do oponente na tela;
if (mediaYBolinha > mediaYRaqueteOponente) {
direcaoRaqueteOponente = 1;
} else {
direcaoRaqueteOponente = -1;
}
  • Caso a mediaYBolinha seja superior a mediaYRaqueteOponente, ou seja, esteja abaixo da raquete do oponente verticalmente (eixo y quanto mais desce, maior o valor). Por esse motivo, direcaoRaqueteOponente continua sendo positiva, a fim de aumentar o valor de yRaqueteOponente (fazer a raquete descer). Caso isso não seja verdade, direcaoRaqueteOponente será igual a -1, fazendo com que a raquete adversária vá para cima;

  • Por fim, realizou-se uma atribuição com soma:

      yRaqueteOponente += 6 * random(0.6, 0.95) * direcaoRaqueteOponente;
      }

Onde:

  • O valor 6 foi apenas um número que trouxe um bom resultado à operação;
  • random(0.6, 0.95) gerará um valor aleatório entre o intervalo de 0.6 e 0.95;
  • direcaoRaqueteOponente determinará se a raquete irá para cima ou para baixo, como vimos anteriormente.

Prontinho! Assim o oponente vai acertar e errar de forma mais natural.


Deixando o jogo mais completo:

É interessante mudar sua função bolinhaNaoFicaPresa() para uma mais completa:

function bolinhaNaoFicaPresa() {
    if (xBolinha - raio <= 0){
xBolinha = 35;
} else {
    if (xBolinha - raio >= 588){
xBolinha = width - 35;
    }
    }
}

Nesse caso, altera a posição horizontal da bolinha caso ela esteja muito próxima da borda e da raquete ao mesmo tempo, fazendo isso dos dois lados.


Se precisar de ajuda com qualquer dúvida ou problema fico à disposição, conte com a gente!

Um bom dia para você e bons estudos.

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