Processing程式設計學習指南3.2 我們的好朋友：setup()和draw()

<b>3.2　我們的好朋友：setup()和draw()</b>

<b></b>

剛從馬拉松賽跑中歸來的你肯定滿是疲倦。為了更好地學習processing，你要将剛剛學習的知識迅速應用到你的第一個動态processing草圖當中去。和第2章中的靜态示例不同，這個程式會持續不斷地運作（也就是說直到使用者退出為止）。這将通過使用兩個“代碼塊”（block of code）來完成：setup()和draw()。嚴格意義上講，setup()和draw()都是函數。後面章節會深入探讨如何定義你自己的函數。現在，你就把他們暫且了解為需要寫代碼所在的兩個區域。

什麼是代碼塊？

代碼塊是任何一段由大括号包圍的代碼。

幾段代碼之間也可以互相嵌套，例如：

這是一種非常重要的代碼建構方式，它允許你在一大堆代碼中，将代碼分組為獨立的代碼塊分别進行管理。程式設計的一個慣例是在每個代碼塊的每一行都縮進，使得代碼更具可讀性。processing也可以幫助你整理格式，你可以通過“編輯”→“自動對齊”來實作。這能夠讓你更加友善管理諸多的代碼塊，尤其是後面章節的示例會變得更加複雜，因而管理代碼就更加重要。至于目前，你唯一要做的事情是學習兩個簡單的代碼塊：setup()和draw()。

讓我們來看下一開始你會覺得句法非常奇怪的setup()和draw()，如圖3-1所示。

誠然，圖3-1中的代碼由許多部分構成，看似非常複雜以至于會讓你感到迷惑：我已經講過大括号表明了一個代碼塊的起始位置，但是為什麼在setup和draw的後面還會有小括号呢？噢，我的天呐，這裡的void又是什麼？它讓我感到異常困惑！眼下，你不得不适應在并不了解所有事情的情況下使用processing，随着本書内容的逐漸展開，更多的概念會被闡述，到那個時候你就會了解這些句法的真正内涵了。

現在，我們把注意力集中到圖3-1中的句法結構，它控制着整個程式的運作流程，如圖3-2所示。

代碼是如何運作的？當你運作一個程式，它會嚴格地按照指令運作：首先執行setup()中的代碼，然後執行draw()中的代碼。這個運作順序就像這樣：

1a, 1b, 1c, 2a, 2b, 2a, 2b, 2a, 2b, 2a, 2b, 2a, 2b, 2a, 2b…

現在，我會将zoog的示例以動态草圖的方式重寫，如示例3-1。

示例3-1：作為動态草圖的zoog

在processing裡運作示例3-1中的代碼。是不是看上去很奇怪？你會發現視窗中的内容沒有任何變化。這看起來就是靜态的草圖！這是怎麼回事？難道這一節一直以來的讨論都是徒勞？

事實上，如果你仔細檢查下代碼，你會發現在draw()函數中的變量沒有任何變化。代碼每循環一次，程式每次執行相同的指令。是以，是的，程式一直在運作，每次都在視窗重新繪制，隻是由于每次繪制的内容是一樣的，是以它看起來是靜止的！

練習3-2：将你在第2章末尾創造的代碼以動态程式的方式重新編寫。盡管看上去和之前是一樣的，但要對你的成果充滿信心！