1
resposta

Me adiantei um pouco e fui além da Aula. Consegui criar a Raquete do oponente. Porém não consigo movimentar ela

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


//Velocidades da Bolinha
let velocidadeXbolinha = 3
let velocidadeYbolinha = 3


//Variáveis Raquete
let xRaquete = 5
let yRaquete = 150
let raqueteComprimento = 10
let raqueteAltura = 85

//Variáveis Raquete da IA
let xRaqueteIA = 585
let yRaqueteIA = 150
let raqueteIAcomprimento = 10
let raqueteIAaltura = 85
let velocidadeYraqueteIA = 3


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

function draw() {
  background(0)
  mostrabolinha()
  movimentaBolinha()
  verificaColisaoBolinha()
  mostraRaquete()
  MovimentaMinhaRaquete()
  verificaColisaoRaquete()
  mostraRaqueteOponente()
  movimentoRaqueteIA()
}

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

function movimentaBolinha(){
  xBolinha += velocidadeXbolinha
  yBolinha += velocidadeYbolinha
}

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

function mostraRaquete(){
   rect(xRaquete,yRaquete,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 + raqueteAltura){
     velocidadeXbolinha *= -1 
  }  
}

function mostraRaqueteOponente(){
rect(xRaqueteIA, yRaqueteIA, raqueteIAcomprimento,raqueteIAaltura )  
}

function movimentoRaqueteIA(){
  velocidadeYraqueteIA += yRaquete
}

1 resposta

Olá, Maycon! Tudo certo por aí?

Antes de tudo, agradeço a paciência em aguardar uma resposta!

A variável velocidadeYraqueteIA é utilizada para aumentar ou diminuir o valor da posição vertical da raquete, que é representada por yRaqueteIA. Sendo assim, quando desejamos realizar a movimentação da raquete, precisamos alterar o valor de yRaqueteIA, da seguinte maneira:

yRaqueteIA += velocidadeYraqueteIA

Para de fato alterar a posição vertical da raquete do oponente, podemos realizar o seguinte código:

function movimentoRaqueteIA(){
  velocidadeYraqueteIA = yBolinha - yRaqueteIA - raqueteIAaltura / 2 - 30;
  yRaqueteIA += velocidadeYraqueteIA + 50
}

Por meio da função acima, alteramos o valor de velocidadeYraqueteIA conforme a posição da bolinha. A operação que foi feita possibilita uma proporcionalidade entre velocidadeYraqueteIA e yBolinha.

Logo em seguida, o valor de velocidadeYraqueteIA foi atribuído à yRaqueteIA. Para haver uma margem de erro entre os dois elementos, foi somado à velocidade o valor 50.

Ao longo do curso, esta função será analisada mais detalhadamente, inclusive com a construção de uma relação entre os pontos acumulados durante o jogo e o deslocamento da raquete do oponente!

Para somar ao seu aprendizado, deixo uma dica muito importante para quando estamos desenvolvendo um programa. Ao declarar os tamanhos das duas raquetes, utilizou-se, ao todo, quatro variáveis. Contudo, uma vez que a altura e o comprimento das duas são iguais, podemos somente utilizar duas variáveis, evitando repetições desnecessárias.

Com a modificação, as variáveis da Raquete da IA ficarão assim:

//Variáveis Raquete da IA
let xRaqueteIA = 585
let yRaqueteIA = 150
let velocidadeYraqueteIA = 3

Ao fim, chegaremos no seguinte código:

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

//Velocidades da Bolinha
let velocidadeXbolinha = 3
let velocidadeYbolinha = 3

//Variáveis Raquete
let xRaquete = 5
let yRaquete = 150
let raqueteComprimento = 10
let raqueteAltura = 85

//Variáveis Raquete da IA
let xRaqueteIA = 585
let yRaqueteIA = 150
let velocidadeYraqueteIA = 3

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

function draw() {
  background(0)
  mostrabolinha()
  movimentaBolinha()
  verificaColisaoBolinha()
  mostraRaquete()
  MovimentaMinhaRaquete()
  verificaColisaoRaquete()
  mostraRaqueteOponente()
  movimentoRaqueteIA()
}

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

function movimentaBolinha(){
  xBolinha += velocidadeXbolinha
  yBolinha += velocidadeYbolinha
}

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

function mostraRaquete(){
   rect(xRaquete, yRaquete, 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 + raqueteAltura){
     velocidadeXbolinha *= -1 
  }  
}

function mostraRaqueteOponente(){
    rect(xRaqueteIA, yRaqueteIA, raqueteComprimento, raqueteAltura )  
}

function movimentoRaqueteIA(){
    velocidadeYraqueteIA = yBolinha - yRaqueteIA - raqueteAltura / 2 - 30;
    yRaqueteIA += velocidadeYraqueteIA + 50
}

Fico à disposição para te auxiliar caso surjam dúvidas ao longo dos seus estudos.

Até mais, Maycon!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado! ✓.