1
resposta

Aleatorizar o Erro

Oi, pessoal! Tudo bem? Observei que com o cálculo do erro proposto a raquete do oponente sempre erra ficando abaixo da bolinha. Estava pensando se seria possível tornar esse erro aleatório, ou pelo menos variável. Ou seja, ora a raquete do oponente erre para mais ora para menos. Pensei em fazer utilizando o número de pontos e, caso o número de pontos seja um número par, a raquete erre para mais e, caso contrário erre para menos, porém não obtive sucesso. Alguém poderia me dar uma luz? Segue o código:

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();
  verificaColisaoComBorda();
  mostraRaquete(xMinhaRaquete, yMinhaRaquete);
  mostraRaquete(xRaqueteDoOponente, yRaqueteDoOponente);
  verificaColisaoRaquete(xMinhaRaquete, yMinhaRaquete);
  verificaColisaoRaquete(xRaqueteDoOponente, yRaqueteDoOponente);
  movimentaMinhaRaquete();
  movimentaRaqueteDoOponente();
  mostraPontos();
  mudaPlacar();
}

//variáveis de sons;
let ponto;
let raquetada;
let trilha;



//variáveis da bolinha;
let xBolinha = 300;
let yBolinha = 200;
let diametroBolinha = 13;
let raio = diametroBolinha / 2;
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

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

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

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

//variáveis da minha raquete;
let alturaMinhaRaquete = 90;
let comprimentoMinhaRaquete = 10;
let xMinhaRaquete = 5;
let yMinhaRaquete = 150;


//variáveis da raquete do oponente;
let alturaRaqueteDoOponente = 90;
let comprimentoRaqueteDoOponente = 10;
let xRaqueteDoOponente = 585;
let yRaqueteDoOponente = 150;
let chanceDeErrar = 0;
let velodidadeYRaqueteOponente;

let colidiu = false;

function mostraRaquete(x, y){
  rect(x, y, comprimentoMinhaRaquete,alturaMinhaRaquete);
}

function movimentaMinhaRaquete(){
  if(keyIsDown(UP_ARROW)){
     yMinhaRaquete -= 10;
     }
  if(keyIsDown(DOWN_ARROW)){
     yMinhaRaquete += 10;
     }
}
function verificaColisaoRaquete(x, y){
  colidiu = collideRectCircle(x, y,comprimentoMinhaRaquete,alturaMinhaRaquete,
xBolinha,yBolinha,raio);
  if (colidiu){
    velocidadeXBolinha *= -1;
    raquetada.play();
  }
}

function movimentaRaqueteDoOponente(){
  velodidadeYRaqueteOponente = (yBolinha - alturaRaqueteDoOponente / 2);
  yRaqueteDoOponente = velodidadeYRaqueteOponente + chanceDeErrar;
  calculaChanceDeErrar();
}

//variáveis de pontuação;
let meusPontos = 0;
let pontosDoOponente = 0;

function mostraPontos(){
  stroke(255);
  textAlign(CENTER);
  textSize(16);
  fill(color(148, 0,211));
  rect(150, 10, 40, 20);
  fill(255);
  text(meusPontos, 170, 26);
  fill(color(139, 0,0));
  rect(450, 10, 40, 20);
  fill(255);
  text(pontosDoOponente, 470, 26);
}

function mudaPlacar(){
  if(xBolinha - raio <= 0){
    pontosDoOponente += 1;
    ponto.play();
  }
  if(xBolinha + raio >= width){
    meusPontos += 1;
    ponto.play();
  }
}

function calculaChanceDeErrar(){
  if (pontosDoOponente >= meusPontos) {
    chanceDeErrar += 5
    if (chanceDeErrar >= 75){
    chanceDeErrar = 75
    }
  } else {
    chanceDeErrar -= 5
    if (chanceDeErrar <= 25){
    chanceDeErrar = 25
    }
  }
  if (meusPontos % 2 == 0){
    chanceDeErrar *= -1;
  }
}

//Grande abraço pra vocês!
1 resposta

Olá, Matheus! Tudo bem com você?

Esse mesmo ponto surgiu em outro tópico aqui no fórum. Essa implementação de aleatoriedade deixa o jogo mais dinâmico mesmo.

Olha só, nós podemos utilizar os métodos Math.floor() e Math.random() para trabalhar em cima da raquete do oponente, pois vão fornecer a aleatoriedade no divisor e também da posição da raquete.

Vou deixar o código aqui que foi feito em cima do projeto de um aluno para você conferir:


//bolinha
let xBolinha = 300;
let yBolinha = 300;
let raio = 8;
let diametro = raio*2;


//raquete
let xRaquete = 5;
let yRaquete = 150;
let comprimentoRaquete = 10;
let alturaRaquete = 90;

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


//velocidade bolinha (dificuldade)
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

//pontuação
let meusPontos = 0;
let pontosDoOponente = 0;

//sons do jogo
let raquetada;
let musicafundo;
let ponto;

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

//background do jogo
function setup() {
  createCanvas(600, 400);
  musicafundo.loop();
}

//funções jogo
function draw() {
  background(50);
  mostrabolinha();
  movimentaçaobolinha();
  verificadorcolisao();
  mostraraquete(xRaquete, yRaquete);
  movimentaraquete();
  verificadorcolisaoraquete();
  mostraraquete(xRaqueteOponente, yRaqueteOponente);
  movimentaraqueteoponente();
  verificaColisaoRaqueteOponente();
  incluiPlacar();
  marcaPonto();
  loop();
  }

//programação

function mostrabolinha(){
  circle(xBolinha, yBolinha, diametro)}

function movimentaçaobolinha(){
  xBolinha += velocidadeXBolinha;
  yBolinha += velocidadeYBolinha;}

function verificadorcolisao(){
  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, comprimentoRaquete, alturaRaquete)}

function movimentaraquete(){
  if (keyIsDown(UP_ARROW)){yRaquete -= 5;}
  if (keyIsDown(DOWN_ARROW)){yRaquete += 5;}}

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


function movimentaraqueteoponente(){
//AQUI ENTRE O CÓDIGO COM OS MÉTODOS PARA SUGERIR ALEATORIEDADE
  velocidadeYOponente = (yBolinha - yRaqueteOponente - alturaRaquete) / 2;
 yRaqueteOponente += velocidadeYOponente/(Math.floor(Math.random() * 2) +1); 

}


function verificaColisaoRaqueteOponente(){
  if (xBolinha + raio > xRaqueteOponente &&  yBolinha - raio < yRaqueteOponente + alturaRaquete 
  && yBolinha + raio > yRaqueteOponente)
  { 
  velocidadeXBolinha *= -1; raquetada.play()
  }
  }


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(400, 10, 40, 20);
    fill(255);
    text(pontosDoOponente, 420, 26);}

function marcaPonto() {
    if (xBolinha > 590) {
        meusPontos += 1; ponto.play()
    }
    if (xBolinha < 10) {
        pontosDoOponente += 1; ponto.play()
    }

}

O post completo está nesse tópico aqui https://cursos.alura.com.br/forum/topico-a-bolinha-ou-acerta-ou-erra-158142

Você pode testar no seu projeto a mesma lógica e compartilhar conosco o resultado :)

Fico no aguardo, um abraço e bons estudos!!!