Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] O bolão que deseja emagrecer!

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Interagindo com o usuário e atividade O bolão que deseja emagrecer!

por ATHOS CABRAL MORAES
| 107.4k xp | 11 posts

Fiquei com uma dúvida a respeito da resposta do exercício. Nos 2 else if o raio está somando e subtraindo, mas testei sem as operações e apenas escrevendo o raio e funcionou.

Essa mudança pode fazer diferença em algum momento???

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

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

    pincel.fillStyle = 'gray';
    pincel.fillRect(0, 0, 600, 400);

    var raio = 10;

    function desenhaCirculo(evento) {

        var x = evento.pageX - tela.offsetLeft;
        var y = evento.pageY - tela.offsetTop;

        console.log(x + ',' + y);

        if (evento.shiftKey && evento.altKey) {

            alert('Só aperte uma tecla por vez, por favor!');

        } else if(evento.shiftKey && raio <= 40) {  /*raio + 10*/
            raio = raio + 10;

        } else if(evento.altKey && raio >= 10) {    /*raio - 5*/
            raio = raio - 5;

        }

        pincel.fillStyle = 'blue';
        pincel.beginPath();
        pincel.arc(x, y, raio, 0, 2 * 3.14);
        pincel.fill();

    }

    tela.onclick = desenhaCirculo;

</script>
1 resposta
solução!
por Monalisa Meyrelle de Sousa Silva
| 1761.6k xp | 3992 posts
Alura Scuba Team Monitoria Fórum Ops

Olá, Athos, tudo bem?

Para uma melhor compreensão, vamos observar o código abaixo:

else if(evento.shiftKey && raio + 10 <= 40) {
            raio = raio + 10;

        } else if(evento.altKey && raio - 5 >= 10) {
            raio = raio - 5;

        }

Neste código, o instrutor realiza a soma e subtração na condição else if como uma forma de simulação para saber se podemos continuar aumentando ou diminuindo o raio do círculo. No entanto, a ausência da soma e subtração nessa condição faz com o que os valores do raio ultrapassem o valor permitido no exercício. Então, por exemplo, caso no seu código o raio tenha valores entre 31 e 40, ele irá atingir valores como 41 e 50 em uma somatória - ultrapassando dessa forma a proposta inicial da questão, é que um raio que não ultrapasse o valor 40. Por isso, a somatória e a subtração na condição else if se torna essencial. O código a seguir faz a mesma verificação proposta no exercício, só que de forma decomposta, para exemplificar o passo a passo:

var possivelValorDoRaio = raio + 10;

if (possivelValorDoRaio <= 40){
    raio += 10;
}

Notei também que no seu código você escreve pincel.fillStyle = 'gray', o correto seria pincel.fillStyle = 'grey', ou seja, iremos preencher o retângulo, pincel.fillRect(0, 0, 600, 400), com a cor cinza, que em inglês é grey. Espero ter ajudado.

Caso surja dúvida, estou à disposição.

Abraço.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!