Não marca meus pontos e bolinha entrando no espaço entre a raquete e a borda | Lógica de programação: comece em lógica com o jogo Pong e JavaScript

2
respostas

por Jefferson dos Santos Silva

| 19.9k xp | 7 posts

Boa tarde

Meu código não faz funcionar a pontuação para mim quando a bolinha bate na borda do oponente quando está próximo à raquete na parte de cima, o mesmo não acontece quando bate na parte de baixo.

E por que a bolinha às vezes entra no espaço entre a raquete e a borda.?

O que estou fazendo de errado.?

let xBolinha = 300;
let yBolinha = 200;
let diametro = 10;
let raio = diametro / 2;

let velocidadeXbolinha = 2;
let velocidadeYbolinha = 2;

let velocidadeXoponente = 2;
let velocidadeYoponente = 2;

let xRaquete = 5;
let yRaquete = 150;
let xRaqueteOponente = 587;
let yRaqueteOponente = 150;
let comprimentoRaquete = 8;
let alturaRaquete = 100;

let meusPontos = 0;
let pontosOponente = 0;

function setup() {
  createCanvas(600, 400);
}

function draw() {
  background(0);
  mostraBolinha();
  velocidadeBolinha();
  colisaoBorda();
  mostraRaquete(xRaquete, yRaquete);
  mostraRaquete(xRaqueteOponente, yRaqueteOponente);
  movimentaRaquete();
  movimentaRaqueteOponente();
  colisaoRaquete();
  colisaoRaqueteOponente();
  placar();
  marcaPonto();
}

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

function mostraRaquete(x, y) {
  rect(x, y, comprimentoRaquete, alturaRaquete);
}

function movimentaRaquete() {
  if(keyIsDown(SHIFT)) {
    yRaquete -= 10; 
  }
  if(keyIsDown(CONTROL)) {
    yRaquete += 10;     
  }
}

function movimentaRaqueteOponente() {
  if(keyIsDown(UP_ARROW)) {
    yRaqueteOponente -= 10; 
  }
  if(keyIsDown(DOWN_ARROW)) {
    yRaqueteOponente += 10;     
  }
}

function colisaoRaquete() {
  if(xBolinha - raio < xRaquete + comprimentoRaquete
    && yBolinha - raio < yRaquete + alturaRaquete 
      && yBolinha + raio > yRaquete) {
  velocidadeXbolinha *= -1; 
  }  
}

function colisaoRaqueteOponente() {
  if(xBolinha + raio > xRaqueteOponente
    && yBolinha + raio < yRaqueteOponente + alturaRaquete 
      && yBolinha + raio > yRaqueteOponente - alturaRaquete) {
  velocidadeXbolinha *= -1; 
  }  
}

function velocidadeBolinha() {
  xBolinha += velocidadeXbolinha;
  yBolinha += velocidadeYbolinha;
}

function colisaoBorda() {
  if (xBolinha + raio > width || xBolinha - raio < 0) {
    velocidadeXbolinha *= -1;
  }
  if (yBolinha + raio > height || yBolinha - raio < 0) {
    velocidadeYbolinha *= -1;
  }
}

function placar() {
  fill(255);
  text(meusPontos, 250, 40);
  text(pontosOponente, 350, 40);
}

function marcaPonto() {
  if(xBolinha > 595) {
    meusPontos += 1; 
  }
  if(xBolinha < 5) {
    pontosOponente += 1;   
  }
}

2 respostas

por Camila Pessôa

| 920.3k xp | 1928 posts

Alura Scuba Team

20/05/2022

Olá, Jefferson! Tudo certo?

Eu testei seu jogo no meu p5.js e funcionou normalmente. A alteração que percebi é que a raquete do oponente que se tornou a raquete do jogador e o tamanho da bolinha está bem pequeno :D.

Você poderia compartilhar o link do seu projeto para que eu possa visualizar melhor?

Fico no aguardo!

por Rodrigo Py Gonçalves Barreto

| 41.7k xp | 13 posts

29/05/2022

Fala Guilherme!

Vou colaborar aqui também. Eu estava procurando exatamente a mesma resposta que você e descobri o seguinte: o diâmetro da bolinha de alguma forma influencia o código. Eu estava com diâmetro 30 e não estava marcando ponto nenhum, depois disso, a ÚNICA alteração que fiz no meu código foi diminuir o diâmetro para 15 e pronto. Tudo funcionou. Vou deixar meu código inteiro aqui abaixo, pelo menos o que eu fiz até esse ponto.

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

//Velocidade da bolinha let velocityXBolinha = 6; let velocityYBolinha = 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;

//Variável colisão let colidiu = false

//Variável placar let meusPontos = 0; let pontosOponente = 0;

function setup() { createCanvas(600, 400); }

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

}

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

function movimentaBolinha (){ xBolinha += velocityXBolinha; yBolinha += velocityYBolinha; }

function verificaColisaoBorda (){ if (xBolinha + raio > width || xBolinha - raio < 0){velocityXBolinha *=-1}

if (yBolinha + raio > height || yBolinha - raio < 0){velocityYBolinha *= -1} }

function mostraRaquete (x, y) { rect(x, y, raqueteComprimento, raqueteAltura);}

function mostraRaqueteOponente () { rect(xRaqueteOponente, yRaqueteOponente, raqueteComprimento, raqueteAltura);}

Chegou a hora de transformar