0:00:00.877,0:00:06.001
Estamos de volta ao nosso Winston [br]e eu adicionei um texto a ele.

0:00:06.001,0:00:11.072
O quero fazer é a posicionar o texto [br]embaixo de cada um desses rótulos

0:00:11.072,0:00:13.210
para mostrar cada ponto da linha.

0:00:13.210,0:00:15.197
Mas agora ele está em todo lugar.

0:00:15.197,0:00:19.036
É porque estamos definindo o faceX e faceY[br]em números aleatórios na função.

0:00:20.655,0:00:22.837
Em vez disso, o que quero é dizer pra ele:

0:00:22.857,0:00:25.291
Ei, aqui está a posição exata[br]que eu quero

0:00:25.291,0:00:27.855
que você desenhe o rosto.

0:00:27.861,0:00:30.300
Eu quero poder especificar a[br]posição cada vez que eu

0:00:30.320,0:00:33.999
chamar a função, da mesma forma[br]que fazemos com a ellipse() e o rect().

0:00:34.049,0:00:36.850
Porque eu quero ser capaz de[br]colocar um Winston aqui,

0:00:36.850,0:00:40.553
e um Winston aqui, e outro aqui,[br]e um outro aqui,

0:00:40.563,0:00:43.856
e eu não quero lugares aleatórios [br]cada vez que eu chamar a função.

0:00:44.836,0:00:49.292
Para isso, temos de especificar [br]"parâmetros" para a função,

0:00:49.932,0:00:53.784
tanto em nossa definição de função...[br](aqui no topo)

0:00:53.794,0:00:58.237
e em nossa chamada de função, aqui em [br]baixo, quando realmente a chamarmos.

0:00:58.237,0:01:05.022
Assim, de drawWinston(), queremos passar[br]para faceX e faceY, e usar esses valores

0:01:05.022,0:01:09.647
que passamos em vez de gerá-los[br]aleatoriamente.

0:01:10.837,0:01:14.401
Vamos pensar sobre o que passaremos[br]para estas chamadas de função aqui

0:01:15.001,0:01:18.508
Queremos a posição dos Winstons sob [br]cada pedaço de texto,

0:01:18.698,0:01:20.816
por isso, provavelmente [br]queremos o X e o Y

0:01:20.816,0:01:23.667
de cada Winston por ser semelhante [br]aos números

0:01:23.767,0:01:25.873
que passaremos para [br]as funções "text()".

0:01:25.873,0:01:33.278
Talvez, apenas 10 pixels menor no y. [br]Assim, talvez o primeiro seria de 10 e 30,

0:01:33.278,0:01:37.388
e, em seguida, talvez 200, 230...

0:01:37.698,0:01:43.972
10, 230...200, 230. É o mesmo que as [br]coordenas do texto, só estou acrescentando

0:01:43.972,0:01:48.763
10 a cada y, porque eu quero[br]apenas um pouco menor.

0:01:49.493,0:01:54.273
Ok, mas o Winston não se moveu. [br]Isso é porque não dissemos a nossa função

0:01:54.273,0:01:58.723
que estamos passando os parâmetros,[br]por isso ainda está usando

0:01:58.723,0:02:00.123
esses valores aleatórios.

0:02:00.123,0:02:02.917
Portanto, a fim de contar essa função,[br]"Ei, vamos dar esta

0:02:02.917,0:02:04.307
informação em vez disso",

0:02:04.307,0:02:09.182
nós temos que dar os nomes dos [br]parâmetros dentro desses parênteses.

0:02:09.182,0:02:15.757
Então, vamos chamá-lo de faceX e facey, [br]e separá-los por uma vírgula,

0:02:15.757,0:02:17.822
e vamos chamá-lo assim, porque

0:02:18.054,0:02:21.153
isso é o que estamos usando para se[br]referir a eles na função, ok?

0:02:21.153,0:02:25.273
Então, dessa forma não temos que[br]reescrever o resto do nosso código.

0:02:25.273,0:02:29.274
Mas mesmo assim, nada aconteceu; [br]o Winston ainda está em todo o lugar.

0:02:29.274,0:02:32.734
Bem, se você olhar para o topo da nossa[br]função, estamos substituindo o

0:02:32.734,0:02:35.932
"faceX" e "faceY" com valores [br]aleatórios, ainda.

0:02:35.942,0:02:40.052
Então, tudo o que temos a fazer [br]é excluir essas linhas...

0:02:42.071,0:02:46.572
E agora, o "faceX" e "faceY" estão sendo [br]passados para a função,

0:02:46.582,0:02:49.836
e ele está usando os valores [br]que estamos chamando aqui.

0:02:49.836,0:02:54.166
Agora, como você pode ver, eu não fiz [br]corretamente a posição do Winston,

0:02:54.166,0:03:00.146
porque esqueci que o texto fica posicionado [br]de acordo com a parte superior esquerda,

0:03:00.146,0:03:02.002
e o rosto de acordo com o centro.

0:03:02.002,0:03:07.044
Então, eu só preciso ir e mexer com[br]os meus números um pouco aqui, certo?

0:03:07.044,0:03:09.776
Provavelmente precise mover [br]os x sobre um monte deles,

0:03:09.776,0:03:14.987
e mover sobre este, certo?...[br]então essa é a nossa criança...

0:03:14.987,0:03:18.091
E agora tudo o que tenho que fazer [br]é mudar o que eu estou

0:03:18.091,0:03:22.124
passando para a função, e eu não tenho que[br]mudar a definição de todas as funções,

0:03:22.138,0:03:26.129
porque sempre vai levar os valores que[br]nós passamos.

0:03:26.129,0:03:28.889
Assim como com o "ellipse ()" [br]e o "rect ()".

0:03:28.889,0:03:33.428
Ok, então eu meio que posicionou ele, mas[br]notei que o Winston é bem grande.

0:03:33.428,0:03:36.127
Ele está sobreposto, [br]por isso ele não se encaixa.

0:03:36.127,0:03:40.222
Bem, já que eu coloquei todo o código para[br]desenhá-lo em uma função, eu posso mudar

0:03:40.222,0:03:45.172
o tamanho de todos de uma vez só por mudar[br]a linha de código que desenha a elipse.

0:03:45.260,0:03:50.480
Então, digamos que se fizermos ele com [br]190..sim, o Winston fará uma dieta de 190.

0:03:50.956,0:03:55.514
Muito bem, então agora ele vai se encaixar[br]muito melhor e, em seguida

0:03:55.514,0:03:59.058
você sabe que eu poderia ajustar para [br]levá-lo lá pra dentro, certo?

0:04:01.658,0:04:06.118
Legal. Então vamos fazer uma revisão final[br]do que esse código faz.

0:04:06.513,0:04:09.288
Ele define uma função[br]chamada drawWinston (),

0:04:09.288,0:04:14.754
e diz que esta função recebe dois valores,[br]e os rotula como "faceX" e "faceY",

0:04:14.754,0:04:19.204
e esses valores vêm basicamente como[br]variáveis que podemos usar em qualquer

0:04:19.204,0:04:22.192
lugar dentro da função, assim como [br]usamos as variáveis

0:04:22.192,0:04:23.932
que nós declarados no topo.

0:04:24.533,0:04:29.494
E então podemos chamar esta função sempre[br]que quisermos depois de declará-la,

0:04:29.494,0:04:32.488
e podemos passar em valores diferentes,[br]de modo que ele vai usar

0:04:32.498,0:04:34.078
esses novos valores de cada vez.

0:04:34.775,0:04:37.391
Agora você já viu a parte[br]legal sobre funções.

0:04:37.391,0:04:40.828
Podemos chegar a um código que [br]pensamos que seria útil para recusar,

0:04:40.828,0:04:43.480
mas também podemos utilizar [br]parâmetros para dizer:

0:04:43.480,0:04:47.089
"Ei, aqui tem algo que você pode mudar [br]para personalizar esse código."

0:04:47.089,0:04:49.773
É como uma receita. Você escreve as [br]instruções gerais,

0:04:49.773,0:04:53.509
e se perceber que precisa alimentar [br]quatro Winstons em vez de um,

0:04:53.509,0:04:56.783
não tem que começar tudo de novo.[br]Basta alterar as instruções originais

0:04:56.783,0:04:58.259
e multiplicar tudo por quatro.

0:04:58.259,0:05:01.217
Agora você pode pensar sobre as [br]receitas em seu código!

0:05:01.217,0:05:02.361
Delícia.

0:05:02.361,0:05:04.460
Legendado por [Fernando dos Reis][br]Revisado por [Cainã Perri]