1
resposta

[Projeto] Projeto final - PLUS: raquete não ultrapassa as bordas

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

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

//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;

//variáveis de colisão
let colidiu = false;

//variáveis do placar
let meusPontos = 0;
let pontosDoOponente = 0;
let chanceDeErrar = 0;

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

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

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

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

//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 >= 0) {
    yRaquete -= 10;
  }
  if (keyIsDown(DOWN_ARROW) && yRaquete <= height - raqueteAltura) {
    yRaquete += 10;
  }
}

function verificaColisaoRaquete(x, y) {
  colidiu = collideRectCircle(x, y, raqueteComprimento, raqueteAltura, xBolinha, yBolinha, raio);
  if (colidiu) {
    velocidadeXBolinha *= -1;
    raquetada.play();
  }
}

function movimentaRaqueteOponente() {
  if (keyIsDown(87) && yRaqueteOponente >= 0) {
    yRaqueteOponente -= 10;
  }
  if (keyIsDown(83) && yRaqueteOponente <= height - raqueteAltura) {
    yRaqueteOponente += 10;
  }
}

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(pontosDoOponente, 470, 26);

}

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

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

function bolinhaNaoFicaPresa(){
    if (xBolinha - raio < 0){
      xBolinha = 23
    }
    if (xBolinha + raio > 600){
      xBolinha = 580
    }
}
1 resposta

Bom dia Carlos, tudo certo? Espero esteja tendo um bom dia!

Antes de tudo, obrigado pela paciência na espera da resposta.

Parabéns por concluir mais essa etapa da sua trajetória aqui na Alura, continue mergulhando cada vez mais na programação que estaremos aqui para te ajudar pro que der e vier!

Gostei muito de como elaborou seu código de modo a tornar possível um modo multijogador local e as raquetes ficassem contidas na tela, eu adoraria sugerir alguns pontos quanto ao seu código que podem te ajudar a melhorar ele ainda mais:


  • Aumentar a velocidade da bolinha, nesse caso de 2 para 6, tornaria o jogo mais rápido e emocionante;

  • Retirar a função e a variável relacionada a chance de erro, como o nosso oponente é alguém que estará do nosso lado e não um robô não haverá uso para elas;

  • Percebi que o jogador 1 tem vantagem de sempre marcar 2 pontos por vez, para deixar o jogo mais equilibrado para ambos o certo seria marcar 1 ponto por acerto, para isso precisamos fazer algumas alterações:

Pontos Duplos

Precisamos olhar primeiro para a função de marcar pontos, como são só os nossos pontos que estão duplicando vamos focar somente na parte dos meusPontos:

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

  }

A função funciona da seguinte maneira, assim que o eixo X da bolinha ultrapassa 590 os pontos começam a serem marcados.

Como a nossa tela do jogo tem 600x400 e o valor atribuído para começar a marcar ponto é um pouco longe da borda, podemos alterar este valor para um maior que a bola assim que passar dessa área, conte somente um ponto e já volte ao bater na borda.

Testando um bom número que encontrei foi 595, com ele os pontos serão marcados de 1 em 1 para nós:

//Alteramos o valor da função marcar ponto de 590 para 595;
function marcaPonto() {
  if (xBolinha > **595**) {
    meusPontos += 1;
    ponto.play();
}

Espero que isso tenha ajudado de algumas forma, se tiver qualquer dúvida ou necessitar de ajuda fique à vontade para usar o fórum, conte comigo se precisar!

Um bom dia e bons estudos!