Olá,
Dentro do meu atual projeto com base na aula, gostaria de aumentar o campo percorrido. Gostaria de auxilio de como realizar o aumento da imagem
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Olá,
Dentro do meu atual projeto com base na aula, gostaria de aumentar o campo percorrido. Gostaria de auxilio de como realizar o aumento da imagem
Olá, Gabriel, tudo bem?
No P5.js, você pode manipular o tamanho da imagem de fundo usando a função image().
A função image() recebe cinco parâmetros: image(img, x, y, width, height). Onde:
img é a imagem que você deseja desenhar.x e y são as coordenadas onde a imagem será desenhada.width e height são a largura e a altura da imagem, respectivamente.Se você deseja aumentar a imagem de fundo, você pode simplesmente aumentar os valores de width e height.
Por exemplo, se você tem uma imagem de fundo chamada bg e quer aumentá-la, você pode fazer algo assim:
image(bg, 0, 0, width*2, height*2);
Neste exemplo, a imagem de fundo será desenhada na posição (0,0) e terá o dobro do tamanho original.
Porém, é importante lembrar que, ao aumentar a imagem, você pode perder qualidade, pois a imagem será esticada para se ajustar ao novo tamanho. Portanto, é sempre uma boa ideia usar uma imagem de fundo que seja grande o suficiente para cobrir a área desejada sem perda de qualidade.
Espero ter ajudado e bons estudos!
Boa noite!
Espero que esteja bem,
Na minha aplicação não consegui de fato projetar o que foi proposto no comentário, contudo ao analisar melhor, entendi que na function setup alterando as propriedades de X e Y, Altera também o tamanho da tela.!
ex:
(function setup()
{
createCanvas(500, 400);
}
)
Oi, Gabriel! Estou bem e você?
É isso mesmo, realmente a função createCanvas() cria um elemento canvas no documento e define suas dimensões em pixels, a função image() é usada para desenhar a imagem mesmo.
Uma dica é acessar a página de referências do P5.js:
Que ótimo que achou uma solução para o seu projeto!
Qualquer dúvida, fico à disposição.
Abraços e bons estudos!