0:00:01.434,0:00:05.833
Agora que aprendeu o básico sobre loops, [br]vamos criar um desenho com loop bem legal

0:00:05.833,0:00:09.189
Como esse, Ballon Hooper [br]voando em um lindo céu.

0:00:09.419,0:00:14.305
Enquanto estou escrevendo um rascunho do [br]código, pense em como você faria isso,

0:00:14.305,0:00:16.281
porque logo você vai fazer.

0:00:16.281,0:00:19.987
Primeiro, sempre ajuda [br]dividir o programa em passos.

0:00:19.987,0:00:24.832
Vamos começar desenhando os balões, que[br]é uma elipse repetida várias vezes

0:00:24.832,0:00:26.897
E isso soa como um trabalho para um loop.

0:00:26.907,0:00:32.224
Então, vamos adicionar umas linhas,[br]e depois adicionar a Balloon Hooper.

0:00:34.404,0:00:37.293
Aqui temos um fundo branco. [br]Que pode ser bem intimidador.

0:00:37.763,0:00:41.519
As vezes, ajuda a manter as coisas um[br]pouco mais amigáveis adicionando um fundo

0:00:41.519,0:00:43.135
só pra contrabalancear.

0:00:44.035,0:00:45.823
Agora, já que queremos fazer um loop,

0:00:45.823,0:00:49.457
seu primeiro pensamento deve ter [br]sido as questões abordados da última vez.

0:00:50.547,0:00:53.802
Vamos rever rapidamente dessa[br]vez, se você precisa de uma revisão,

0:00:53.802,0:00:56.397
reveja "Introdução aos laço[br]de repetição While"

0:00:56.917,0:01:00.243
Agora, a primeira pergunta: [br]"O que queremos repetir?"

0:01:01.393,0:01:03.280
Vamos tentar desenhar o primeiro balão.

0:01:03.280,0:01:05.655
Porque queremos desenhar aqueles balões.

0:01:05.765,0:01:07.660
Você pode ir em frente e fazer isso,

0:01:07.830,0:01:14.816
talvez assim, quer saber, está um [br]pouco pequeno, e meio deslocado também.

0:01:15.066,0:01:16.699
Vamos tentar mover um pouquinho.

0:01:16.929,0:01:20.606
Isso é apenas parte da programação, [br]quando tenta algo, você percebe que

0:01:20.606,0:01:24.347
não é o que você queria, e então tenta[br]novamente e por acaso chega mais perto.

0:01:26.897,0:01:28.588
Agora, vamos colorir, certo?

0:01:28.588,0:01:31.279
Não pensamos nisso quando [br]estávamos pensando nos passos,

0:01:31.279,0:01:33.752
podemos dizer que é apenas parte[br]do desenho do balão.

0:01:33.772,0:01:34.575
Tudo bem?

0:01:34.575,0:01:40.271
Precisamos pensar sobre como exatamente [br]queremos mudar esse balão durante o loop.

0:01:40.271,0:01:43.467
Bem, queremos que o balão seja[br]desenhado por toda a tela, certo?

0:01:43.467,0:01:47.003
Queremos que seja desenhado, aqui, [br]e aqui e aqui,

0:01:47.003,0:01:50.329
Queremos que o computador faça [br]isso, porque eu desenho muito mal.

0:01:50.629,0:01:52.426
Então podemos mudar um pouco,

0:01:52.426,0:01:54.103
apenas mudando o primeiro número,

0:01:54.103,0:01:57.681
que como você se lembra controla o eixo x:[br]o posicionamento lateral.

0:01:58.281,0:01:59.839
Mas, é muito pouco, certo?

0:01:59.839,0:02:02.465
Não é como aquela outra [br]foto bacana que tínhamos antes.

0:02:02.675,0:02:06.471
Ao invés, vamos chama-lá de <i>x</i>,[br]para a posição <i>x</i>,

0:02:06.471,0:02:09.598
e vamos usar outra variável para a[br]que usamos antes.

0:02:10.998,0:02:13.955
E agora, vamos mudar a variável[br]dentro do nosso loop,

0:02:13.955,0:02:15.602
então usaremos um <i>loop while</i>,

0:02:15.912,0:02:21.076
e dentro do loop x vai mudar [br]toda vez, talvez, incrementando 20.

0:02:22.006,0:02:27.058
Se movermos a elipse, com cuidado, para [br]não mudar a declaração da variável nela,

0:02:27.398,0:02:30.209
porque, ai ficaríamos pensando o que[br]fizemos de errado.

0:02:30.209,0:02:33.140
Vale a pena tentar fazer isso[br]sozinho, se você está curioso.

0:02:34.770,0:02:37.131
Agora nosso terceira pergunta[br]sobre o loop é:

0:02:37.131,0:02:38.932
"Por quanto tempo queremos repetir ?"

0:02:39.272,0:02:43.518
Podemos imaginar que queremos [br]que repita até que tenha saído da tela.

0:02:43.648,0:02:46.276
Talvez todo o percurso até[br]que x seja menor igual a 400.

0:02:46.276,0:02:48.714
Isto é legal porque, tem algo [br]acontecendo, certo?

0:02:48.714,0:02:50.803
Mas não é exatamente o que vislumbramos.

0:02:51.083,0:02:55.259
Assim como antes, você tem que ir[br]incrementando até o ponto que imaginamos.

0:02:55.879,0:02:59.000
Primeiro, as elipses estão [br]muito próximas, vamos arrumar isso.

0:02:59.340,0:03:02.065
É bom dar um pouco de espaço[br]para entre elas.

0:03:02.295,0:03:05.560
Mas agora, elas estão indo [br]um pouco além do limite da tela,

0:03:05.560,0:03:09.217
se mudarmos o limite, elas podem sumir.

0:03:09.217,0:03:16.507
As elipses que aparecem aqui, muito [br]próximas de x não serão mais desenhadas.

0:03:16.507,0:03:18.645
E é isso o que essa parte do loop faz.

0:03:19.385,0:03:23.182
Certo? Ainda podemos dizer [br]"Queremos mudar um pouco as elipses"

0:03:23.192,0:03:28.689
queremos colocar elas um pouco [br]mais pra baixo,mudar o tamanho delas

0:03:29.139,0:03:32.418
E parte legal do loop While é que [br]podemos fazer tudo ao mesmo tempo.

0:03:33.898,0:03:36.060
Certo. Perfeito.

0:03:36.950,0:03:40.002
Olhando para esses balões, seria legal[br]colocar uns cordões neles.

0:03:40.002,0:03:42.674
Se gostamos deles, precisamos colocar[br]uns cordões neles.

0:03:42.674,0:03:44.010
senão eles vão voar por aí.

0:03:44.010,0:03:45.806
Precisamos de uma linha para cada um.

0:03:45.806,0:03:49.728
Queremos colocar uma linha [br]que comece do centro de cada balão,

0:03:50.158,0:03:54.120
para ficar mais fácil, e todos [br]descem meio que juntos ao mesmo ponto,

0:03:54.330,0:03:55.752
mais ou menos assim.

0:03:55.912,0:03:59.101
Como podemos fazer o programa[br]fazer isso, ao invés de desenhar isso?

0:03:59.291,0:04:03.150
Podemos pensar que, se queremos repetir[br]alguma coisa, definitivamente queremos

0:04:03.280,0:04:05.664
que esteja dentro do loop, [br]então vamos fazer isso.

0:04:05.664,0:04:07.773
E se queremos que esteja no[br]centro da elipse,

0:04:07.773,0:04:09.884
terá que começar [br]por essas duas coordenadas.

0:04:09.884,0:04:10.825
Podemos fazer isso.

0:04:10.825,0:04:13.535
E você pode dizer [br]vamos terminar isso, tanto faz.

0:04:14.125,0:04:15.825
Já está perto o suficiente.

0:04:16.435,0:04:19.206
Mas novamente, não está [br]perfeito, como você pode notar.

0:04:19.376,0:04:23.267
Então precisamos arrumar isso. Primeiro[br]vamos arrumar essa coisa horrível.

0:04:23.457,0:04:24.478
O que é isso ?

0:04:24.478,0:04:29.319
O cordão que desenhamos está sobrepondo[br]nosso balão, e isso não está certo.

0:04:29.319,0:04:34.634
Queremos que a elipse cubra a linha,[br]podemos fazer isso mudando a ordenação.

0:04:34.869,0:04:38.987
Um monte de coisas que você [br]aprendeu estão sendo usadas aqui.

0:04:38.987,0:04:42.145
Bem, está bom, mas talvez [br]queiramos mudar a cor dessas linhas,

0:04:42.245,0:04:44.964
e como faremos isso se [br]estamos criando o programa?

0:04:45.134,0:04:47.494
Bem nós faremos e iremos[br]verificar a documentação.

0:04:47.494,0:04:50.684
Ou veremos o vídeo de documentação se[br]não soubermos como fazer isso.

0:04:50.684,0:04:54.133
Seguindo em frente usaremos <i>stroke()</i>[br]para configurar o cor da linha.

0:04:54.873,0:04:59.344
e talvez usar, não sei, talvez essa cor?

0:04:59.754,0:05:05.605
Está lindo! Agora, tudo o que [br]precisamos fazer é desenhar o Hooper.

0:05:05.645,0:05:09.839
E tudo o que temos que fazer é [br]desenhar ela nessa imagem, assim,

0:05:09.839,0:05:12.751
Você pode ver a documentação [br]para saber como eu descobri isso,

0:05:12.751,0:05:17.415
e apenas movendo ela, vai parecer que ela[br]está segurando o balão e voando pelo céu.

0:05:18.145,0:05:19.879
E é isso, terminamos!

0:05:19.879,0:05:25.784
Você pode tentar decorar os balões, como[br]adicionar coisas pra ficarem mais legais.

0:05:26.130,0:05:29.480
E você pode até usar um [br]loop no seu próximo desenho.

0:05:29.480,0:05:31.000
Legendado por [Valter Bigeli][br]Revisado por [Fernando dos Reis]