Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Fiz um circulo ir e voltar trocando de cor aleatoriamente, testem ai :)

<canvas width="500" height="500"></canvas>

<script>

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

    pincel.fillStyle = '#85FDAB';
    pincel.fillRect(0, 0, 500, 500);

    function desenharCirculo(x, y, cor, raio) {
        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2*Math.PI);
        pincel.fill();
    }

    function limpaTela() {
        pincel.fillStyle = '#85FDAB';
        pincel.fillRect(0, 0, 500, 500);
    }

    function andarParaDireita() {
        limpaTela();
        desenharCirculo(x, y, cor, raio);
        x++;
        if(x==500-raio) {
            cor = corAleatoria();
            direcao = 'esquerda';
        }
    }

    function andarParaEsquerda() {
        limpaTela();
        desenharCirculo(x, y, cor, raio);
        x--;
        if(x==raio) {
            cor = corAleatoria();
            direcao = 'direita';
        }
    }

    function moverCirculo() {
        if(direcao == 'direita') {
            andarParaDireita();
        } 
        if(direcao == 'esquerda') {
            andarParaEsquerda();
        }
    }


    function corAleatoria() {
        return cores[Math.round(Math.random()*5)];
    }

    var cores = ['blue', 'red', 'purple', 'green', 'yellow', 'orange'];
    var x = 30;
    var y = 30;
    var cor = corAleatoria();
    raio = 20;
    var direcao = 'direita';

    var atualizacaoFrame = setInterval(moverCirculo, 5);
</script>
1 resposta
solução!

Oi, Danilo!! Tudo bom?

Nossa, que legal o seu programa! Parabéns pela criatividade, cuidado e dedicação em elaborar o código! Com certeza a sua ideia será uma inspiração para outros alunos e outras alunas que também estão estudando lógica de programação com este curso.

Continue sempre assim, com interesse nos estudos. Caso surjam dúvidas em algum momento, fico à disposição.

Abraços!