image

Processing的開發(fā)環(huán)境「Processing Development Environment，縮寫為PDE」我們已經(jīng)安裝完成，現(xiàn)在就可以開始編程了。

PDE開發(fā)環(huán)境介紹

以Windows版本為例，運(yùn)行PDE，你會發(fā)現(xiàn)外觀跟Arduino的IDE有些類似。Processing源文件后綴名為.pde，而早期的Arduino文件也是以次為后綴的。

運(yùn)行PDE

PDE界面由四部分組成：菜單欄、工具欄、代碼編輯區(qū)、控制臺。其中工具欄的運(yùn)行和停止按鈕是使用最頻繁的。我們編寫代碼后，點(diǎn)擊運(yùn)行，屏幕會出現(xiàn)顯示窗口，來展示運(yùn)行結(jié)果。現(xiàn)在我們沒有編寫任何代碼，點(diǎn)擊運(yùn)行后，會顯示默認(rèn)的100*100的灰色空白窗口。

默認(rèn)空白窗口

第一行代碼

我們在代碼編輯區(qū)寫下第一行代碼：

ellipse(60,60,80,80);

點(diǎn)擊運(yùn)行，會在顯示窗口中看到一個圓形。

圓

我們使用ellipse()函數(shù)來畫橢圓，指定圓心坐標(biāo)，當(dāng)后面兩個參數(shù)相同時，畫出來的就是圓形。我們知道Arduino的程序一般有兩個函數(shù)：setup()和loop()。類似的，我們的Processing程序也有兩個重要函數(shù)：

• setup()：程序啟動只執(zhí)行一次。
• draw()：在setup()函數(shù)執(zhí)行后循環(huán)執(zhí)行。

我們寫一個規(guī)范點(diǎn)的程序：

void setup()
{
  size(700, 400); //設(shè)置窗口大小
  background(255); //設(shè)置背景顏色
}

void draw()
{
  fill(random(255), random(255), random(255)); //設(shè)置填充色，RGB顏色隨機(jī)產(chǎn)生
  ellipse(mouseX, mouseY, 80, 80); //以鼠標(biāo)坐標(biāo)畫圓
}

運(yùn)行程序，會看到隨著鼠標(biāo)移動，會畫出不同顏色的圓。

變化的圓

我們使用「Ctr+S」對程序進(jìn)行保存，在菜單欄的「文件」中，點(diǎn)擊「輸出程序」，你的代碼會被打包成獨(dú)立文件，PDE會根據(jù)你的選擇創(chuàng)建Windows、Mac、Linux程序。

輸出程序

可執(zhí)行文件

范例和文檔

在菜單欄「文件」中，你可以找到很多的范例程序，可以參考這些例程，你可以打開并運(yùn)行查看顯示內(nèi)容。

范例

在代碼編輯區(qū)，對你不熟悉的函數(shù)右鍵，選擇在參考文件中搜索，或者在「幫助」中，都可以打開引用文檔。文檔默認(rèn)保存在你PDE的安裝目錄中。

引用文檔

當(dāng)你不清楚函數(shù)的用途，或者參數(shù)、返回值、用法時，可以去查看文檔，這是最好的學(xué)習(xí)資料了。