WEBVTT

00:00:01.434 --> 00:00:07.073
現在，你已經學會了迴圈的基礎知識，讓我們繼續，做出一個像這樣的超讚迴圈，

00:00:07.073 --> 00:00:09.849
熱氣球飛行員飄過一片美麗的天空

00:00:09.849 --> 00:00:16.401
當我談到程式編寫時，我希望你先想想你會怎麼寫，因為你馬上就要自己寫了。

00:00:16.401 --> 00:00:20.207
首先，將你的程式拆開為一些步驟，這麼做每次都有用。

00:00:20.207 --> 00:00:27.485
一開始我們先畫一些氣球，像這樣重複地橢圓，聽起來就像迴圈。

00:00:27.485 --> 00:00:33.774
然後，我們將以此為基礎，最後再加上熱氣球飛行員。

00:00:33.774 --> 00:00:37.963
好，這裡是一片空白，看起來有點可怕。

00:00:37.963 --> 00:00:43.869
加上背景，有時候背景可以讓畫面看起來比較和善，也比較容易讓人代入。

00:00:43.869 --> 00:00:49.933
現在，既然我們要畫一個迴圈，你應該會先想到我們上次講到的迴圈問題。

00:00:49.933 --> 00:00:56.933
我們很快地再做一次，如果你需要複習，可以回到「介紹 While 迴圈」。

00:00:56.933 --> 00:01:01.393
現在，第一個問題是：「我們要重複什麼？」

00:01:01.393 --> 00:01:06.441
來，我們先畫第一個氣球，因為我們要複製這些氣球。

00:01:06.441 --> 00:01:15.066
你可以現在立刻做，也許像那樣，嗯，你知道的，它有點小，位置不太對，

00:01:15.066 --> 00:01:17.169
所以，我們試著做一點點移動。

00:01:17.169 --> 00:01:25.183
這只是程式設計的一部分。先做一些嘗試，當發現不是你想要的就再試，直到越來越接近。

00:01:25.183 --> 00:01:33.870
現在我們需要加上顏色，是吧？在思考步驟時沒想到這個，這部分就是畫氣球的其中一部分。

00:01:33.870 --> 00:01:40.898
好了？下一步，我們來思考，究竟想要這個氣球，在迴圈過程中，做出什麼改變。

00:01:40.898 --> 00:01:47.733
嗯，我們想要氣球橫排在螢幕上，是嗎？我們希望它像這裡和這裡，還有這裡，

00:01:47.733 --> 00:01:51.013
我們希望由電腦來畫，因為我畫得非常糟糕。

00:01:51.013 --> 00:01:58.391
我們可以透過改變第一個數字編造，就如你們印象中控制 x 位置：橫向整理的位置。

00:01:58.391 --> 00:02:02.767
不過，我想，那其實蠻無趣的，是吧？不像我們之前所看到的酷圖片。

00:02:02.767 --> 00:02:11.108
於是，讓我們稱這個 x 位置為 x，而且我們要使一個可變數跟原來看到的一樣。

00:02:11.108 --> 00:02:15.912
現在，我們要改變迴圈中的可變數，所以會用到 while 迴圈，

00:02:15.912 --> 00:02:22.136
然後在迴圈中，命令 x 每次改變，也許，20

00:02:22.136 --> 00:02:27.398
如果我們非常小心的在裏面移動橢圓，當然不可以移動裏面的可變數聲明，

00:02:27.398 --> 00:02:30.209
否則，我們就得找出哪裡可能會出錯。

00:02:30.209 --> 00:02:34.375
但，這絕對值得自己動手做，如果你夠好奇的話。

00:02:34.375 --> 00:02:39.392
好，接著，我們第三個迴圈問題是：「我們想要重複多長？」

00:02:39.392 --> 00:02:43.818
或許我們可以繼續往下，基本上直到超出螢幕側邊

00:02:43.818 --> 00:02:46.647
也許一直到 x 小於400。

00:02:46.647 --> 00:02:51.163
現在，這很酷，因為我們做了東西出來，對吧？但它並不是我們想要的。

00:02:51.163 --> 00:02:55.839
跟之前一樣，你知道的，我們只要修改它、慢慢地改成我們想要的樣子就可以了。

00:02:55.839 --> 00:02:59.400
因此，讓我們先來解決橢圓全擠在一起的問題。

00:02:59.400 --> 00:03:02.409
好，給它們彼此一些空間。

00:03:02.409 --> 00:03:09.317
但你知道，也許他們離螢幕邊還是有點太遠了，如果我們改終點，

00:03:09.317 --> 00:03:16.507
我們就可以讓橢圓消失，因為在這裡我們命令，只要 x 的值是某個數，就停止繪圖。

00:03:16.507 --> 00:03:19.385
這就是這部分 while 迴圈的特色。

00:03:19.385 --> 00:03:24.945
好吧？我們也可以說「好吧，也許我們想給橢圓一點改變」，我們希望它們都向下移動，

00:03:24.945 --> 00:03:34.018
我們想稍為改變它們的大小，而 while 迴圈不錯的地方是我們可以一次地把它們都改。

00:03:34.018 --> 00:03:36.896
好的，完美！

00:03:36.896 --> 00:03:42.024
來看看這些氣球，加一些線上去應該不錯。如果我們想要，就放一些上去吧！

00:03:42.024 --> 00:03:43.892
不然，它們會飄走！

00:03:43.892 --> 00:03:50.573
所以，每一顆都要一條線。為了簡單化，我們想把線頭都放在每個氣球的中心，

00:03:50.573 --> 00:03:55.912
且它們都往下延伸到同一位置，大概像那樣。

00:03:55.912 --> 00:03:59.430
那如何使程式這樣做，而不是靠自己手描呢？

00:03:59.430 --> 00:04:05.000
所以如果要複製東西，我們得要把它放在 while 迴圈裡，所以來做出那條線吧！

00:04:05.000 --> 00:04:10.702
如果我們要把它放在橢圓的中心，那麼它得從這兩個座標開始，才可以做到。

00:04:10.702 --> 00:04:16.618
你可以把線尾放到任何一處。那其實很接近！

00:04:16.618 --> 00:04:23.655
然而，再一次，你可能留意到它不完美，我們要修復它。先來修復這個醜陋的傢伙。

00:04:23.655 --> 00:04:29.813
再來，我們畫的線段疊在氣球上，可以這樣一點也不對。

00:04:29.813 --> 00:04:35.249
我們想要橢圓覆蓋著線，可這樣只能夠透過改變順序去做。

00:04:35.249 --> 00:04:38.764
你學過很多東西，而這次是這些東西一起應用的時候。

00:04:38.764 --> 00:04:45.315
很好！我們也想要改這些線條的顏色。如果我們真的自己要寫程式，可怎麼辦？

00:04:45.315 --> 00:04:47.224
我們去看看那些檔案。

00:04:47.224 --> 00:04:50.474
或者，如果我們不知道怎麼做，也可以看影片檔。

00:04:50.474 --> 00:04:54.924
所以，我們可以使用 stroke() 來設定這些線的顏色，

00:04:54.924 --> 00:05:00.253
也許讓它們變成，不知道，也許，那種顏色？

00:05:00.253 --> 00:05:10.152
很漂亮！最後，我們需要做的是繪製熱氣球飛行員。只要將她的影像檔置入就可以，像這樣，

00:05:10.152 --> 00:05:16.536
你可以參考檔案，看我是如何做的。你知道，只要移動她，使她看起來像抓著氣球

00:05:16.536 --> 00:05:18.229
飄過天空。

00:05:18.229 --> 00:05:26.534
你做到了！我們完成了！你可以試著裝飾氣球，你想得到東西都加進迴圈，使這些氣球更酷些，

00:05:26.534 --> 00:05:30.534
甚至你下次繪圖時可以運用迴圈。