Olá Thalita, tudo certo?
Ótima pergunta!
De início, vamos modificar as variáveis de velocidade da bolinha para armazenar 2 estados, um estacionário (0) e outro em movimento (6):
let velocidadeXBolinha = [0,6];
let velocidadeYBolinha = [0,6];
Criamos algumas variáveis extras referentes a velocidade da bolinha atualmente, dessa forma poderemos manipular individualmente quando a velocidade deve mudar entre os 2 estados, como queremos que o jogo já comece com a bolinha se movendo atribuímos a variável com o valor de movimento:
let velocidadeXAtual = velocidadeXBolinha[1];
let velocidadeYAtual = velocidadeYBolinha[1];
Faremos algumas alterações no código para que possamos manejar esses momentos de velocidade:
//Seguindo a velocidade atual, seja ela 0 ou 7
function movimentaBolinha(){
xBolinha += velocidadeXAtual;
yBolinha += velocidadeYAtual;
}
//Inverte a direção da velcoidade atual da bolinha, estando parada ou em movimento
function verificaColisaoBorda(){
if (xBolinha + raio> width ||
xBolinha - raio< 0){
velocidadeXAtual *= -1;
}
if (yBolinha + raio> height ||
yBolinha - raio < 0){
velocidadeYAtual *= -1;
}
}
//Para a colisão da raquete seguir a mesmo norma da colisão da borda
function verificaColisaoRaquete(x, y){
colidiu = collideRectCircle(x, y,raqueteComprimento,raqueteAltura,
xBolinha,yBolinha,raio);
if (colidiu){
velocidadeXAtual *= -1;
raquetada.play();
}
}
Criaremos uma função bolinhaInicio()
ela será responsável para levar e manter a bolinha na posição inicial até segunda ordem:
function bolinhaInicio() {
xBolinha = 300;
yBolinha = 200;
velocidadeXAtual = velocidadeXBolinha[0];
velocidadeYAtual = velocidadeYBolinha[0];
}
//Adicionamos ela no final de uma pontuação:
function marcaPonto(){
if (xBolinha > 590){
meusPontos += 1;
ponto.play();
bolinhaInicio();
}
if (xBolinha < 10){
pontosDoOponente += 1;
ponto.play();
bolinhaInicio();
}
}
Por fim adicionamos uma última função que faça a bolinha se movimentar quando cliquemos na seta para cima ou para baixo se a bolinha estiver no centro:
function bolinhaVolta() {
if ((keyIsDown(UP_ARROW) ||
keyIsDown(DOWN_ARROW)) &&
xBolinha == 300 &&
yBolinha == 200) {
velocidadeXAtual = velocidadeXBolinha[1];
velocidadeYAtual = velocidadeYBolinha[1];
}
}
//Aplicamos ela dentro do movimento da nossa raquete:
function movimentaMinhaRaquete(){
if (keyIsDown(UP_ARROW)){
yRaquete -= 10;
}
if (keyIsDown(DOWN_ARROW)){
yRaquete += 10;
}
bolinhaVolta();
}
Prontinho, assim o código vai estar funcionando como deseja.
Segue o projeto no p5 já funcionando:
Caso ainda tenha dúvidas sobre este tópico, estarei à disposição. Abraços e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.