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

Os carros sumiram e daqui a pouco meus cabelos também sumirão

Gente do céu, tô seguindo as aulas tudo certinho e tudo dando certo, mas como quero que os carros da parte de baixo andem na direção oposta, eu tento fazer listas e laços a mais (sempre terminando em Sup pra parte superior da tela e em Inf para a metade inferior). Porém, justamente ao adicionar as listas e laços da metade inferior da tela, todos os carros somem incluindo os da metade superior. Retrocedi nas aulas pra ver se eu identificava qual é o meu erro, sem sucesso. Depois, como estou fazendo 2 for pra cada função, resolvi mudar a letra do índice no segundo for para j no lugar do i, achando que usar i nas duas estivesse interferindo. Mais uma vez, sem sucesso. Estou colocando aqui o link do projeto para que alguém possa me ajudar a fazer ele funcionar, pois eu esgotei todas as opções de correção que pude imaginar. Obrigado e abraços a todos.

https://editor.p5js.org/mathias.bonuma/sketches/DYJ1Q6Voq

2 respostas
solução!

Oi oi, Tudo bem?

Refatorei seu código, realmente havia alguns probleminhas no momento de aplicar a lógica mas você pode verificar e tirar suas dúvidas: carros.js

//Todos Carros
let wCarro = 50;
let hCarro = 40;

let xCarrosSup = [600, 600, 600];
let xCarrosInf = [10, 10, 10];

let yCarrosSup = [40, 96, 150];
let yCarrosInf = [315, 210, 260];

let vCarrosSup = [2, 2.5, 3.2];
let vCarrosInf = [2, 3.3, 2.3];

function mostraCarro(){  
  for(let i = 0; i < imgCarrosSup.length; i++){
    image (imgCarrosSup[i], xCarrosSup[i], yCarrosSup[i], wCarro, hCarro);
  }
 }

function mostraCarroInf(){
   for(let j = 0; j < imgCarrosInf.length; j++){
    image(imgCarrosInf[j], xCarrosInf[j], yCarrosInf[j], wCarro, hCarro);
   }  
}

function moveCarro(){
  for (let i = 0; i < imgCarrosSup.length; i++){
    xCarrosSup[i] -= vCarrosSup[i];
  }
}

function moveCarroInf(){
  for (let j = 0; j < imgCarrosInf.length; j++){
    xCarrosInf[j] += vCarrosInf[j];
  }  
}

function resetCarro(){
  for (let i = 0; i < xCarrosSup.length; i++){
    if (xCarrosSup[i] < - wCarro){
    xCarrosSup[i] = 600;
    }
  }
}

function resetCarroInf(){
  for (let j = 0; j < xCarrosInf.length; j++){
      if(xCarrosInf[j] > 650){
       xCarrosInf[j] = -10 
      }
   }
}

sketch.js

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

function draw() {
  background(imgEstrada);
  mostraPlayer();
  mostraCarro();
  mostraCarroInf();
  moveCarroInf()
  moveCarro();
  moveCarroInf()
  movePlayer();
  resetCarro();
  resetCarroInf()
  pontosPlayer();
  contaPonto();
}

Sugiro que você leia o artigo P5 - Plano cartesiano para compreender melhor o funcionamento das coordenadas no p5.js.

Fico à disposição!

Bons estudos!

Camila, mais uma vez tu me salvou. Muito obrigado mesmo, funcionou perfeitamente. Vou ler o artigo que tu me indicou aqui agora mesmo.