3
respostas

Placar somando muitos pontos

Olá! Boa Tarde! Fiz todo o passo a passo mostrado nas aulas, porém meus pontos são comtabilizados de 7 em 7, enquantos os pontos do oponente comtabilizam de 1 em 1. Já tentei de tudo que tinha de resposta aqui no Forúm, mas nada resolveu. Alguém consegue me ajudar?

Segue o link do Código para análise e edição:

//Variáveis da Bolinha
let xBolinha = 300;
let yBolinha = 200;
let Diametro = 30;
let raio = Diametro / 2;

//Variáveis da Velocidade Da Bolinha
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;

//Váriaveis da Minha Raquete
let xRaquete = 5;
let yRaquete = 150;
let ComprimentoRaquete = 10;
let AlturaRaquete = 90;

//Variáveis do Oponente
let xRaqueteOponente = 585;
let yRaqueteOponente = 150;
let VelocidadeYOponente;

let Colisão = false;

//placar do jogo
let MeusPontos = 0;
let PontosDoOponente = 0;

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

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);      //1 - Desenha o Background.
  MostrarBolinha(); // 2 - Desenha a bolinha.
  MovimentarBolinha(); // 3 - Movimenta a Bolinha.
  VerificarColisaoDaBolinhaBorda(); // 4 - Verifica Colisão da bolinha com a borda.
  MostraRaquete(xRaquete, yRaquete);
  MostraRaquete(xRaqueteOponente, yRaqueteOponente);
  MovimentoDaMinhaRaquete();
  MovimentoRaqueteOponente();
  VerifColisaoBolinhaComMinhaRaquete();
  VerificaColisaoRaqueteBiblioteca(xRaquete, yRaquete);
  VerificaColisaoRaqueteBiblioteca(xRaqueteOponente, yRaqueteOponente);
  MostrarPlacar();
  MarcarPonto();

  //5 - Volta para a função draw()
  }

function MostrarBolinha(){
  circle(xBolinha, yBolinha, Diametro)
}

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

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

function MostraRaquete(x, y){
  rect(x, y, ComprimentoRaquete, AlturaRaquete);
  }


function MovimentoDaMinhaRaquete() {
    if (keyIsDown(UP_ARROW)) {
        yRaquete -= 10;
    }
    if (keyIsDown(DOWN_ARROW)) {
        yRaquete += 10;
    }
}

function MovimentoRaqueteOponente() {
     if (keyIsDown(87)) {
        yRaqueteOponente -= 10;
    }
    if (keyIsDown(83)) {
        yRaqueteOponente += 10;
    }
}

function VerifColisaoBolinhaComMinhaRaquete(){
  if (xBolinha - raio < xRaquete + ComprimentoRaquete
  && yBolinha - raio < yRaquete + AlturaRaquete
  && yBolinha + raio > yRaquete){
        velocidadeXBolinha *= -1;
    }
}

function VerificaColisaoRaqueteBiblioteca(x, y) {
    Colisão = collideRectCircle(x, y, ComprimentoRaquete, AlturaRaquete, xBolinha, yBolinha, raio);
    if (Colisão) {
        velocidadeXBolinha *= -1;
       raquetada.play();
    }
}

function MostrarPlacar() {
    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 MarcarPonto() {
    if (xBolinha + raio > width -1) {
        MeusPontos += 1;
        ponto.play();
    }
    if (xBolinha - raio < 1) {
        PontosDoOponente += 1;
        ponto.play();
    }
}

https://editor.p5js.org/arthurfroznogueira/sketches/gJn5kBKV3

3 respostas

Oi, Arthur! Tudo certo?

Isso está ocorrendo devido à verificação feita na função VerificarColisaoDaBolinhaBorda(). As variáveis xBolinha e yBolinha representam a região central da nossa bolinha. Por esse motivo, para ser considerada apenas a sua borda (região que realmente irá colidir com os lados esquerdo e direito da tela), temos que adicionar ou subtrair o valor de raio (comprimento do centro até a borda) de xBolinha e de yBolinha.

Sabendo disso, iremos realizar as seguintes substituições na função VerificarColisaoDaBolinhaBorda():

  • Alterar xBolinha > width para xBolinha + raio > width;
  • Alterar yBolinha > height para yBolinha + raio > height.

A partir dessas mudanças, chegamos no seguinte resultado:

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

Dessa maneira, os meus pontos e os pontos do oponente passarão a ser computados de 1 em 1!

Espero ter ajudado, Arthur! Fico à disposição em caso de dúvidas.

Até mais!

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

Eu consegui "corrigir" mudando um pouco a borda que o código vai considerar para aumentar o placar... Está dando certo com exceção de quando a bolinha vai atrás da Raquete...

pontosA = meusPontos;
pontosB = pontosOponente;
function marcaPonto () {
  if (xBolinha > 585) {
    pontosA += 1;
  }
  if (xBolinha < 15) {
    pontosB += 1;
  }
}

Oi, Daniel, tudo bem?

Obrigada pela dica! Caso precise de ajuda para resolver esse problema em seu projeto, sugiro abrir um novo tópico no fórum e compartilhar o link para o seu jogo. Dessa maneira, conseguimos analisar de forma mais assertiva o que está afetando a pontuação dos jogadores no Pong.

Para realizar o compartilhamento, podemos seguir os passos abaixo:

  • Localizar a barra superior com os itens “File”, “Edit”, “Sketch”, e “Help” (em Português, as opções seriam: “Arquivo”, “Editar”, “Esboço” e “Ajuda”, respectivamente);
  • Clicar em “File”;
  • Selecionar a opção “Share” ou “Compartilhar”;
  • Copiar o link da terceira opção da lista (de cima para baixo);
  • Colá-lo em seu tópico do fórum.

Outra maneira de fazer isso é selecionando, copiando e colando a url do seu Sketch!

Um forte abraço.