Oi, Gabriel! Tudo certo por aí?
Quando a função mostrarect()
é executada em draw()
, o segundo valor que está sendo passado como parâmetro é velocidadeYOponente
ao invés de yRectOponente
.
mostrarect(xRectOponente,velocidadeYOponente);
Fazendo a alteração, chegamos no seguinte resultado:
mostrarect(xRectOponente, yRectOponente);
Durante o curso, foram apresentados dois caminhos para realizar a colisão da raquete. Sendo assim, podemos escolher uma das opções para utilizar em nosso código. Para evitar erros, recomendo comentar uma das possibilidades, deixando somente uma em funcionamento.
Sinta-se livre para escolher a opção que você mais gostou. Abaixo, eu apresento uma maneira possível e como podemos organizar o código a partir dela, está bem?
Neste caso, eu deixei a função que contém a biblioteca apresentada pelo instrutor. Não só isso, como também adicionei dois parâmetros (x
e y
) à função colisaoRectBiblioteca
e os adicionei ao método collideRectCircle
. Desta maneira, tornamos a função genérica, já que ela pode receber diferentes valores!
// function colisaoRect(){
// if(xBolinha - raio < xRect + comprimentoRect && yBolinha - raio < yRect + alturaRect && yBolinha + raio > yRect){
// velocidadeXBolinha *= -1;
// }
// }
function colisaoRectBiblioteca(x, y){
colideRect= collideRectCircle(x, y, comprimentoRect, alturaRect, xBolinha, yBolinha, raio);
if (colideRect){
velocidadeXBolinha *= -1;
}
}
Para finalizar, atualizei o draw()
com a função colisaoRectBiblioteca
e seus respectivos parâmetros — tanto para as variáveis da nossa raquete, como as da raquete do oponente:
function draw() {
background(0);
mostrabolinha();
movimentabolinha();
colisao();
mostrarect(xRect,yRect);
movimentaRect();
colisaoRectBiblioteca(xRect, yRect); // colisão da nossa raquete!
mostrarect(xRectOponente, yRectOponente);
movimentaRectOponente();
colisaoRectBiblioteca(xRectOponente, yRectOponente) // colisão da raquete do oponente!
}
Com isso, o resultado final do seu código será:
let xBolinha = 300;
let yBolinha = 200;
let diametro = 10;
let raio = diametro/2;
let velocidadeXBolinha = 6;
let velocidadeYBolinha = 6;
let xRect= 5;
let yRect= 150;
let alturaRect= 80;
let comprimentoRect= 10;
let colideRect=false;
let xRectOponente = 585;
let yRectOponente = 150;
let velocidadeYOponente;
function setup() {
createCanvas(600, 400);
}
function draw() {
background(0);
mostrabolinha();
movimentabolinha();
colisao();
mostrarect(xRect,yRect);
movimentaRect();
colisaoRectBiblioteca(xRect, yRect);
mostrarect(xRectOponente, yRectOponente);
movimentaRectOponente();
colisaoRectBiblioteca(xRectOponente, yRectOponente)
}
function mostrabolinha(){
circle(xBolinha,yBolinha,diametro);
}
function movimentabolinha(){
xBolinha += velocidadeXBolinha;
yBolinha += velocidadeYBolinha;
}
function colisao(){
if(xBolinha + raio > width || xBolinha - raio < 0){
velocidadeXBolinha *= -1;
}
if(yBolinha + raio > height || yBolinha - raio < 0 ){
velocidadeYBolinha *= -1;
}
}
function mostrarect(x,y){
rect(x,y,comprimentoRect,alturaRect);
}
function movimentaRect(){
if(keyIsDown(UP_ARROW)){
yRect -=10;
}
if(keyIsDown(DOWN_ARROW)){
yRect +=10;
}
}
// function colisaoRect(){
// if(xBolinha - raio < xRect + comprimentoRect && yBolinha - raio < yRect + alturaRect && yBolinha + raio > yRect){
// velocidadeXBolinha *= -1;
// }
// }
function colisaoRectBiblioteca(x, y){
colideRect= collideRectCircle(x, y, comprimentoRect, alturaRect,xBolinha, yBolinha, raio);
if (colideRect){
velocidadeXBolinha *= -1;
}
}
function movimentaRectOponente(){
velocidadeYOponente = yBolinha - yRectOponente - comprimentoRect / 2 - 30;
yRectOponente += velocidadeYOponente;
}
Caso surjam dúvidas após minha explicação ou ao longo dos seus estudos, lembre-se que você pode contar com o fórum. Fico à disposição para te auxiliar no que for preciso.
Até mais, Gabriel!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado! ✓.