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

[Dúvida] ReferenceError: width is not defined

Olá, como vai?

Estou tendo problemas com a parte de "width", já que o programa aponta como não definida (foto anexada abaixo). Como devo prosseguir?

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

4 respostas
solução!

Oi, estou bem e você?

O programa não reconhece o width por não saber o que ele precisa medir. Pra resolver isso é só colocar a condição dentro da função draw() (aí ele vai saber que é o width do cenário criado). Você também pode colocar a condição dentro de uma nova função e chamar ela na função draw().

Muito obrigada!

Não aparece nenhuma notificação de erro após as mudanças sugeridas. Entretando, não consigo visualizar a prévia, aparecendo uma rápida mensagem de "Loading...". Alguma sugestão de como posso corrigir isso? Será que é um erro do sistema ou dos códigos? Abri uma outra aba com o mesmo site e o programa foi capaz de reproduzir até certo ponto, mas a partir código (listado abaixo) apareceu a mensagem.

function draw(width){ if (xBolinha + raio > width || xBolinha - raio < 0) velocidadeXBolinha *= -1; }

function draw(height){ if (yBolinha + raio > height || yBolinha - raio < 0) velocidadeYBolinha *= -1; }

Fiz uns testes aqui e encontrei duas soluções.

1 - Você pode colocar as condições dentro da draw() que você já fez. Ela ficaria assim:

function draw() {
    background(0);
    circle(xBolinha, yBolinha, diametro);
    xBolinha += velocidadeXBolinha;
    yBolinha += velocidadeYBolinha;
    if (xBolinha + raio > width || xBolinha - raio < 0) {
      velocidadeXBolinha *= -1;
    }
    if (yBolinha + raio > height || yBolinha - raio < 0) {
      velocidadeYBolinha *= -1;
    }
}

2 - Você pode dar um novo nome para a função de colisão e chamar ela dentro da draw(). Desse jeito fica assim:

function draw() {
    background(0);
    circle(xBolinha, yBolinha, diametro);
    xBolinha += velocidadeXBolinha;
    yBolinha += velocidadeYBolinha;
    verificaColisao();
}

function verificaColisao() {
    if (xBolinha + raio > width || xBolinha - raio < 0) {
      velocidadeXBolinha *= -1;
    }
    if (yBolinha + raio > height || yBolinha - raio < 0) {
      velocidadeYBolinha *= -1;
    }
}

Acho que o segundo jeito fica mais organizado, porque o nome da função já explica o que o código faz, mas você pode escolher a opção que achar melhor.

Tentei as duas formas e deu super certo.

Muito obrigada por sua ajuda!