Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

[Bug] JOGO PONG EM JAVASCRIPT

Estava fazendo meu jogo Pong seguindo pelo curso, optei por não importar o rectcolide, assim utilizando o codigo usado na raquete esquerda ( minha raquete) na raquete direita ( raquete do oponente ), sendo assim quando a bola bate na raquete ela volta, e quando vai por cima da raquete ela faz ponto, mas quando ela vai por baixo da raquete ela rebate ( como se tivesse batendo na Raquete, Queria tirar essa duvida e saber onde mais ou menos está errado, Obrigado. Meus codigos utilizados para rebater são :

unction colisaoRaqueteEsquerda(){ if (xBolinha - raio < xRaqueteEsquerda + larguraRaquete && yBolinha - raio < yRaqueteEsquerda + alturaRaquete && yBolinha + raio > yRaqueteEsquerda){ velocidadexBola *= -1; raquetada.play(); } }

function colisaoRaqueteDireita(){ if (xBolinha - raio > xRaqueteDireita - larguraRaquete && yBolinha - raio > yRaqueteDireita - alturaRaquete && yBolinha - raio > yRaqueteDireita ){ velocidadexBola *= -1; raquetada.play(); }

3 respostas

Boa tarde Luis,

percebi que você inverteu o sinal do raio na segunda condicional:

colisaoRaqueteDireita(){ if (xBolinha - raio > xRaqueteDireita - larguraRaquete && yBolinha + raio > yRaqueteDireita + alturaRaquete && yBolinha - raio > yRaqueteDireita ){ velocidadexBola *= -1; raquetada.play(); }

o correto seria yBolinha + raio < yRaqueteDireita + alturaRaquete

também precisa alterar a primeira condicional:

xBolinha - raio > xRaqueteDireita - larguraRaquete 

o correto é:

xBolinha + raio > xRaqueteDireita

Olha esse esboço que fiz abaixo, ajuda a entender a questão dos sinais:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Perdão Matheus, mas fazendo esses ajustes a bolinha nem sequer ficou batendo na Raquete e continuou com o mesmo problema, segue todo o código, penso que talvez o problema talvez esteja em outro lugar, mas não consigo identifica-lo:

//variáveis bolinha let xBolinha = 300; yBolinha = 200; diametroBolinha = 15; raio = diametroBolinha / 2;

//velocidade bolinha let velocidadexBola = 5; velocidadeyBola = 5;

//variáveis da raquete let xRaqueteEsquerda = 5; yRaqueteEsquerda = 150; larguraRaquete = 10; alturaRaquete = 90; xRaqueteDireita = 585; yRaqueteDireita = 150; let velocidadeRD;

//variável do placar let PontosEsquerdo = 0; PontosDireito = 0;

//variáveis do som let raquetada; let ponto;

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

function draw() { background(0); Bolinha(); movimentoBolinha(); colisaoborda(); desenhoRaquete(xRaqueteEsquerda,yRaqueteEsquerda); movimentoRaqueteEsquerda() colisaoRaqueteEsquerda(); movimentoRaqueteDireita(); desenhoRaquete(xRaqueteDireita, yRaqueteDireita); colisaoRaqueteDireita(); Pontuacao(); marcaponto(); carregarsom(); }

function Bolinha(){ circle(xBolinha,yBolinha,diametroBolinha) }

function movimentoBolinha(){ xBolinha += velocidadexBola; yBolinha += velocidadeyBola;}

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

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

function desenhoRaquete(x,y){ rect(x, y, larguraRaquete, alturaRaquete)

}

function movimentoRaqueteEsquerda(){ if (keyIsDown(UP_ARROW)) {yRaqueteEsquerda -= 5}; {if (keyIsDown(DOWN_ARROW)){ yRaqueteEsquerda += 5 } } }

function colisaoRaqueteEsquerda(){ if (xBolinha - raio < xRaqueteEsquerda + larguraRaquete && yBolinha - raio < yRaqueteEsquerda + alturaRaquete && yBolinha + raio > yRaqueteEsquerda){ velocidadexBola *= -1; raquetada.play(); } }

function colisaoRaqueteDireita(){ if (xBolinha + raio > xRaqueteDireita - larguraRaquete && yBolinha - raio > yRaqueteDireita - alturaRaquete && yBolinha + raio > yRaqueteDireita ){ velocidadexBola *= -1; raquetada.play(); } } function movimentoRaqueteDireita(){ if (keyIsDown(87)) {yRaqueteDireita -= 5}; {if (keyIsDown(83)){ yRaqueteDireita += 5 } } }

function Pontuacao(){ stroke(255) textAlign(CENTER) textSize(20) fill(color(255,140,0)) rect(130,4,40,30) fill(255); text( PontosEsquerdo, 150, 26); fill(color(255,140,0)) rect(430,4,40,30) fill(255); text( PontosDireito, 450, 26); }

function marcaponto(){{ if (xBolinha > 590) { PontosEsquerdo += 1; ponto.play(); }}{ if (xBolinha < 10) { PontosDireito += 1; ponto.play(); }}}

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

solução!

Substitui tua função por essa abaixo, corrigi mais algumas coisas, verifica se funciona agora. Essa parte do código é bem chatinha mesmo, também passei uns perrengue quando fiz ela.

 function colisaoRaqueteDireita(){
  if (xBolinha + raio > xRaqueteDireita && yBolinha - raio < yRaqueteDireita + alturaRaquete && yBolinha + raio > yRaqueteDireita){
        velocidadexBola *= -1;
        raquetada.play();
  }
}

Se não funcionar chama aí novamente =]