Entrar Ainda não tem acesso?
1
resposta

Creeperzinho sem vergonha!! kkkk

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Desenhando gráficos com Canvas e atividade A cara do Creeper

por Felipe Mateus de Oliveira
| 49.7k xp | 5 posts

Segue a maneira que montei o meu creeper.

<canvas width="600" height="400"></canvas>

<script>

    var tela= document.querySelector("canvas");
    var pincel= tela.getContext("2d");

//retanguloGeral

/*
    pincel.fillStyle= "lightGrey";
    pincel.fillRect(0,0,600,400);
*/

// Cabeça

    pincel.fillStyle="darkGreen";
    pincel.fillRect(125,50, 350,300);

// Naris

    pincel.fillStyle="black";
    pincel.fillRect(265,200, 70,100);

// Olho 2

    pincel.fillStyle="black";
    pincel.fillRect(175,110, 90,90);

// Olho 3

    pincel.fillStyle="black";
    pincel.fillRect(335,110, 90,90);

// Boca 5

    pincel.fillStyle="black";
    pincel.fillRect(225,240, 40,110);

// Boca 6

    pincel.fillStyle="black";
    pincel.fillRect(335,240, 40,110);





</script>

1 resposta
por Akemi Alice
| 852.4k xp | 2192 posts
Alura Scuba Team Monitora no Scuba Team

Oi, Felipe! Tudo bem?

Excelente resolução! Parabéns pelo empenho na atividade, seu Creeper ficou ótimo!

Uma dica: não há necessidade de escrever pincel.fillStyle='black'; cada vez que for desenhar um novo elemento preto, declarando uma vez a cor, os próximos desenhos ficarão com a cor escolhida. Veja:

pincel.fillStyle = 'black';
    pincel.fillRect(265,200, 70,100);
    pincel.fillRect(175,110, 90,90);
    pincel.fillRect(335,110, 90,90);
    pincel.fillRect(225,240, 40,110);
    pincel.fillRect(335,240, 40,110);

Qualquer dúvida, estamos sempre por aqui!

Ótima semana e bons estudos!