ERRO QUANDO A BOLINHA BATE NA RAQUETE

Bom dia Maxaylla. Tive o mesmo problema que você, consegui entender o problema e ainda bem a solução é bem fácil. :)

Primeiro vamos entender o que está dando problema:

Quando desenhamos a bolinha e os retângulos das raquetes não foi especificado no vídeo que o centro de nosso desenho deveria corresponder ao centro da tela. Abra seu projeto, clique na bolinha, abra a guia fantasia, aquela que usou para desenhar. Ao diminuiu o zoom verá que o centro de sua bolinha está desalinhado com o centro da tela.

Agora vamos à correção do problema:

Faça a correção alinhando o centro da bolinha ao centro da tela. Fala o mesmo para as raquetes. Com isso as posições iniciais das raquetes vão se alterar, portanto corrija as posições iniciais do eixo x. Verá que o jogo ficará melhor.

Espero ter ajudado :)

Olá Felipe,

Obrigada, fiz o que você disse e de fato melhorou bastante mas percebi que o jogo ainda não está 100%. Se eu coloco as dimensões conforme a do professor, a raquete do oponente fica muito recuada e acaba que o som do ponto e da raquete eram tocados ao mesmo tempo então ajustei a raquete do oponente pra que isso não acontecesse. Percebo que ás vezes ele conta dois pontos ao mesmo tempo e até mais, isso é normal?

O seu erro deve ser do play, por que os projetos que tem música no p5js a maioria nunca tem compatibilidade com a música tire todas as variáveis que tenham músicas como o play( ); e assim quando marca um ponto ou quando tocam nas raquetes.

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

//velocida da bolinha
let velocidadeYBolinha = 5;
let velocidadeXBolinha = 5;

//variáveis da minha raquete
let xRaquete = 5;
let yRaquete = 150;
let raqueteComprimento = 7;
let raqueteAltura = 75;

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

let colidiu = false;

//placar do jogo
let meusPontos = 0;
let pontosDoOponente = 0;

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

function preload() {
}

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

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

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

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

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

function movimentaRaqueteOponente(){
  velocidadeYOponente = yBolinha - yRaqueteOponente - raqueteComprimento / 2 - 30;
  yRaqueteOponente += velocidadeYOponente
}

function incluiPlacar(){
  stroke(255);
  textAlign(CENTER);
  textSize(25)
  fill(color(255, 140, 0));
  rect(130, 7, 40, 20);
  fill(255);
  text(meusPontos, 150, 26)
  fill(color(255, 140, 0));
  rect(430, 7, 40, 20);
  fill(255)
  text(pontosDoOponente, 450, 26);
}

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

Oi Maxaylla, precisaria ver seu código para avaliar com mais precisão o porque dos pontos serem marcados juntos. Esse comportamento não é esperado, portanto não é normal. Tenho uma teoria do porque o código estar marcando os dois:

Provável que tenha colocado a adição de pontos dentro da função que verifica a colisão da bola com a borda. Assim quando qualquer uma das condições de tocar a borda acontecer os pontos são adicionados.

Pra corrigir, sugiro uma função específica para contagem de pontos. Dentro dela dois ifs, um para verificar se a bola colidiu na borda esquerda e outro if para verificar a colisão na borda direita. Importante: Chame essa função antes da função que verifica a colisão da bola com a borda.

Olá, Eu conferi o meu com o do professor e a única diferença com o dele seriam as posições das raquetes e se eu coloco as dimensões dele as raquetes ficam muito na frente. Seria abuso se eu te pedir pra dar uma olhada por favor? https://scratch.mit.edu/projects/462403217 obrigada desde já.

Oi Maxaylla, vi seu código ele está perfeito para o que foi pedido no curso, mas caso queira sumir com a falha da pontuação excessiva sugiro algumas alterações:

Problema da marcação excessiva de pontos:

Também tive problema, isso se deve a uma falha resultante do código apresentado no curso. Primeiro vamos entender o que acontece e depois corrigir. A tela do jogo tem 480 pixels de largura, ou seja ela vai de -240 até +240 no eixo x. Podemos ver isso adicionando o cenário Xy-grid no Palco. Outro detalhe importante é que a bolinha foi programada para inverter a direção quando sua borda tocasse na borda da tela. Ou seja quando o x da bolinha menos o raio da bolinha toca o canto esquerdo da tela (-240) a bolinha muda de direção. O mesmo vale para a outra extremidade da tela, caso o x da bolinha mais o raio toque o canto direito da tela (240) ela muda de direção.

Até aqui tudo bem, porém a bolinha também foi programada para mudar de direção quando tocasse as raquetes. Lembre-se que as raquetes do jogador e do oponente estão nas respectivas posições -229 e 231 do eixo x. Isso cria uma falha onde a bolinha vai rebater por trás das raquetes e pontuar várias vezes. Exemplo: a bolinha atinge a borda esquerda da tela (-240 do eixo x) e dá 1 ponto para o oponente. Ela muda de direção, porém bate no fundo da raquete do jogador (-229). Assim ela muda de direção novamente e rebate na borda esquerda da tela (-240 do eixo x) dando mais 1 ponto para o oponente e mudando novamente de direção. Repare que esse movimento se repetirá até que ela saia por uma das extremidades da raquete dando muitos pontos ao oponente.

Como corrigir isso? Podemos programar para que a bolinha evite fazer esse rebote. Para tanto temos que dividir o quinto bloco de código em 2. Um cuidará da raquete do jogador e outro cuidará da raquete do oponente, onde mudaremos o x da bolinha quando ela tocar na raquete. Remova o operador ou e separe os dois sensores tocando em. Deixaremos cada um dentro de um se então clique com o botão direito sobre este comando e o duplique.

Dentro do bloco que referencia minha raquete adicione o comando de movimento mude x para -220 abaixo do comando aponte para a direção. Pois o ponto de contato da bolinha e da borda da raquete é -240 da borda da tela + 10 do espaço da borda com a raque + 5 da largura da raquete + 5 do raio da bola. Faça o mesmo no outro bloco para a raquete do oponente com a diferença que o comando mude x para será no valor de 220.

Um último ajuste, no terceiro e quarto blocos, os que são responsáveis pela pontuação. Dentro do operador menor que, que está no evento espere até que, altere o valores de x para -230 no terceiro bloco e 230 no quarto bloco. Isso ajudará a impedir o excesso de pontuação.

Mudanças visuais e limpeza de código. Modificar o formato da bolinha diminuindo sua altura, pois ela está oval. Deixar ela circular vai ajudar na visualização e no código. Sugiro deixar 15 x15. Você pode conferir essa informação no painel fantasia, no canto superior esquerdo da tela, lá tem um quadro com essa informação.

Remover o comando de controle: Esconda a variável posição y da bolinha. Pois ele não tem funcionalidade ali. Ele se encontra no primeiro bloco, que controla o movimento da bolinha.

Segue o link do remix com as alterações que sugeri: https://scratch.mit.edu/projects/467438342

Desculpe o textão, hehehehehe, mas não sei como explicar de uma maneira mais resumida. Espero que tenha ajudado a entender o bug.

Olá Felipe, desculpa a demora em responder. Fiz todos os ajustes conforme vc me orientou e deu tudo certo, muito obrigada pela sua atenção, ajudou muito. Ainda sou muito leiga nessa área de programação mas acho que deu pra ter mais ou menos uma noção do pq do bugue rsrs. Obrigada!!