WEBVTT 00:00:01.434 --> 00:00:05.833 Agora que aprendeu o básico sobre loops, vamos criar um desenho com loop bem legal 00:00:05.833 --> 00:00:09.189 Como esse, Ballon Hooper voando em um lindo céu. 00:00:09.419 --> 00:00:14.305 Enquanto estou escrevendo um rascunho do código, pense em como você faria isso, 00:00:14.305 --> 00:00:16.281 porque logo você vai fazer. 00:00:16.281 --> 00:00:19.987 Primeiro, sempre ajuda dividir o programa em passos. 00:00:19.987 --> 00:00:24.832 Vamos começar desenhando os balões, que é uma elipse repetida várias vezes 00:00:24.832 --> 00:00:26.897 E isso soa como um trabalho para um loop. 00:00:26.907 --> 00:00:32.224 Então, vamos adicionar umas linhas, e depois adicionar a Balloon Hooper. 00:00:34.404 --> 00:00:37.293 Aqui temos um fundo branco. Que pode ser bem intimidador. 00:00:37.763 --> 00:00:41.519 As vezes, ajuda a manter as coisas um pouco mais amigáveis adicionando um fundo 00:00:41.519 --> 00:00:43.135 só pra contrabalancear. 00:00:44.035 --> 00:00:45.823 Agora, já que queremos fazer um loop, 00:00:45.823 --> 00:00:49.457 seu primeiro pensamento deve ter sido as questões abordados da última vez. 00:00:50.547 --> 00:00:53.802 Vamos rever rapidamente dessa vez, se você precisa de uma revisão, 00:00:53.802 --> 00:00:56.397 reveja "Introdução aos laço de repetição While" 00:00:56.917 --> 00:01:00.243 Agora, a primeira pergunta: "O que queremos repetir?" 00:01:01.393 --> 00:01:03.280 Vamos tentar desenhar o primeiro balão. 00:01:03.280 --> 00:01:05.655 Porque queremos desenhar aqueles balões. 00:01:05.765 --> 00:01:07.660 Você pode ir em frente e fazer isso, 00:01:07.830 --> 00:01:14.816 talvez assim, quer saber, está um pouco pequeno, e meio deslocado também. 00:01:15.066 --> 00:01:16.699 Vamos tentar mover um pouquinho. 00:01:16.929 --> 00:01:20.606 Isso é apenas parte da programação, quando tenta algo, você percebe que 00:01:20.606 --> 00:01:24.347 não é o que você queria, e então tenta novamente e por acaso chega mais perto. 00:01:26.897 --> 00:01:28.588 Agora, vamos colorir, certo? 00:01:28.588 --> 00:01:31.279 Não pensamos nisso quando estávamos pensando nos passos, 00:01:31.279 --> 00:01:33.752 podemos dizer que é apenas parte do desenho do balão. 00:01:33.772 --> 00:01:34.575 Tudo bem? 00:01:34.575 --> 00:01:40.271 Precisamos pensar sobre como exatamente queremos mudar esse balão durante o loop. 00:01:40.271 --> 00:01:43.467 Bem, queremos que o balão seja desenhado por toda a tela, certo? 00:01:43.467 --> 00:01:47.003 Queremos que seja desenhado, aqui, e aqui e aqui, 00:01:47.003 --> 00:01:50.329 Queremos que o computador faça isso, porque eu desenho muito mal. 00:01:50.629 --> 00:01:52.426 Então podemos mudar um pouco, 00:01:52.426 --> 00:01:54.103 apenas mudando o primeiro número, 00:01:54.103 --> 00:01:57.681 que como você se lembra controla o eixo x: o posicionamento lateral. 00:01:58.281 --> 00:01:59.839 Mas, é muito pouco, certo? 00:01:59.839 --> 00:02:02.465 Não é como aquela outra foto bacana que tínhamos antes. 00:02:02.675 --> 00:02:06.471 Ao invés, vamos chama-lá de x, para a posição x, 00:02:06.471 --> 00:02:09.598 e vamos usar outra variável para a que usamos antes. 00:02:10.998 --> 00:02:13.955 E agora, vamos mudar a variável dentro do nosso loop, 00:02:13.955 --> 00:02:15.602 então usaremos um loop while, 00:02:15.912 --> 00:02:21.076 e dentro do loop x vai mudar toda vez, talvez, incrementando 20. 00:02:22.006 --> 00:02:27.058 Se movermos a elipse, com cuidado, para não mudar a declaração da variável nela, 00:02:27.398 --> 00:02:30.209 porque, ai ficaríamos pensando o que fizemos de errado. 00:02:30.209 --> 00:02:33.140 Vale a pena tentar fazer isso sozinho, se você está curioso. 00:02:34.770 --> 00:02:37.131 Agora nosso terceira pergunta sobre o loop é: 00:02:37.131 --> 00:02:38.932 "Por quanto tempo queremos repetir ?" 00:02:39.272 --> 00:02:43.518 Podemos imaginar que queremos que repita até que tenha saído da tela. 00:02:43.648 --> 00:02:46.276 Talvez todo o percurso até que x seja menor igual a 400. 00:02:46.276 --> 00:02:48.714 Isto é legal porque, tem algo acontecendo, certo? 00:02:48.714 --> 00:02:50.803 Mas não é exatamente o que vislumbramos. 00:02:51.083 --> 00:02:55.259 Assim como antes, você tem que ir incrementando até o ponto que imaginamos. 00:02:55.879 --> 00:02:59.000 Primeiro, as elipses estão muito próximas, vamos arrumar isso. 00:02:59.340 --> 00:03:02.065 É bom dar um pouco de espaço para entre elas. 00:03:02.295 --> 00:03:05.560 Mas agora, elas estão indo um pouco além do limite da tela, 00:03:05.560 --> 00:03:09.217 se mudarmos o limite, elas podem sumir. 00:03:09.217 --> 00:03:16.507 As elipses que aparecem aqui, muito próximas de x não serão mais desenhadas. 00:03:16.507 --> 00:03:18.645 E é isso o que essa parte do loop faz. 00:03:19.385 --> 00:03:23.182 Certo? Ainda podemos dizer "Queremos mudar um pouco as elipses" 00:03:23.192 --> 00:03:28.689 queremos colocar elas um pouco mais pra baixo,mudar o tamanho delas 00:03:29.139 --> 00:03:32.418 E parte legal do loop While é que podemos fazer tudo ao mesmo tempo. 00:03:33.898 --> 00:03:36.060 Certo. Perfeito. 00:03:36.950 --> 00:03:40.002 Olhando para esses balões, seria legal colocar uns cordões neles. 00:03:40.002 --> 00:03:42.674 Se gostamos deles, precisamos colocar uns cordões neles. 00:03:42.674 --> 00:03:44.010 senão eles vão voar por aí. 00:03:44.010 --> 00:03:45.806 Precisamos de uma linha para cada um. 00:03:45.806 --> 00:03:49.728 Queremos colocar uma linha que comece do centro de cada balão, 00:03:50.158 --> 00:03:54.120 para ficar mais fácil, e todos descem meio que juntos ao mesmo ponto, 00:03:54.330 --> 00:03:55.752 mais ou menos assim. 00:03:55.912 --> 00:03:59.101 Como podemos fazer o programa fazer isso, ao invés de desenhar isso? 00:03:59.291 --> 00:04:03.150 Podemos pensar que, se queremos repetir alguma coisa, definitivamente queremos 00:04:03.280 --> 00:04:05.664 que esteja dentro do loop, então vamos fazer isso. 00:04:05.664 --> 00:04:07.773 E se queremos que esteja no centro da elipse, 00:04:07.773 --> 00:04:09.884 terá que começar por essas duas coordenadas. 00:04:09.884 --> 00:04:10.825 Podemos fazer isso. 00:04:10.825 --> 00:04:13.535 E você pode dizer vamos terminar isso, tanto faz. 00:04:14.125 --> 00:04:15.825 Já está perto o suficiente. 00:04:16.435 --> 00:04:19.206 Mas novamente, não está perfeito, como você pode notar. 00:04:19.376 --> 00:04:23.267 Então precisamos arrumar isso. Primeiro vamos arrumar essa coisa horrível. 00:04:23.457 --> 00:04:24.478 O que é isso ? 00:04:24.478 --> 00:04:29.319 O cordão que desenhamos está sobrepondo nosso balão, e isso não está certo. 00:04:29.319 --> 00:04:34.634 Queremos que a elipse cubra a linha, podemos fazer isso mudando a ordenação. 00:04:34.869 --> 00:04:38.987 Um monte de coisas que você aprendeu estão sendo usadas aqui. 00:04:38.987 --> 00:04:42.145 Bem, está bom, mas talvez queiramos mudar a cor dessas linhas, 00:04:42.245 --> 00:04:44.964 e como faremos isso se estamos criando o programa? 00:04:45.134 --> 00:04:47.494 Bem nós faremos e iremos verificar a documentação. 00:04:47.494 --> 00:04:50.684 Ou veremos o vídeo de documentação se não soubermos como fazer isso. 00:04:50.684 --> 00:04:54.133 Seguindo em frente usaremos stroke() para configurar o cor da linha. 00:04:54.873 --> 00:04:59.344 e talvez usar, não sei, talvez essa cor? 00:04:59.754 --> 00:05:05.605 Está lindo! Agora, tudo o que precisamos fazer é desenhar o Hooper. 00:05:05.645 --> 00:05:09.839 E tudo o que temos que fazer é desenhar ela nessa imagem, assim, 00:05:09.839 --> 00:05:12.751 Você pode ver a documentação para saber como eu descobri isso, 00:05:12.751 --> 00:05:17.415 e apenas movendo ela, vai parecer que ela está segurando o balão e voando pelo céu. 00:05:18.145 --> 00:05:19.879 E é isso, terminamos! 00:05:19.879 --> 00:05:25.784 Você pode tentar decorar os balões, como adicionar coisas pra ficarem mais legais. 00:05:26.130 --> 00:05:29.480 E você pode até usar um loop no seu próximo desenho. 00:05:29.480 --> 00:05:31.000 Legendado por [Valter Bigeli] Revisado por [Fernando dos Reis]