我與Processing

假期的時候，偶然間獲知了Processing這門語言，在瞭解了它簡單的語法，和通用的程式設計規則後，我進行了一些嘗試。

很有意思的一個程式設計環境。以簡化了的Java來實現影象繪製和設計的工作。其中蘊含著的數學物理知識，讓我感受到了不同學科之間關聯的一條若有若無的連線。

為了更為熟悉改語言的內容和規則，我特意找了兩本書來看。一本書相當基礎的《愛上processing》(密碼: kdg3)，這本書，只要是有點程式設計基礎的同學，基本上是三四個小時就可以看完的。我很快就翻完了。之後便找到了今天的主角——《Processing權威指南》。這本書可以說是非常之厚了。將近七百頁，我花了兩週才看完，當然，也是“有選擇性的通讀”。

看完之後，做個記錄，畢竟，這本書的內容除了介紹Processing語言本身的技巧規則外，更多的是引導讀者去了解、接觸到一些新潮藝術家們的藝術創作旅程中。書中有很多訪談，記錄許多傑出的藝術創作者們關於靈感與技術等方面的思考，值得一看。

而且這本書，從頭到尾提到了很多程式語言的基礎概念，也基本上說清楚了一門面向物件的語言的基本概念。甚至可以當做是一個對於Java語言學習的前奏。只不過這個前奏可能更歡快輕鬆些。

當然，這本書也為讀者更進一步的參與到創作中，實現自己的靈感提供了一些技術上的引導，介紹了很多關於2D&3D影象、聲音、視訊、網路、電子&移動裝置、列印格式等其他屬於Processing本身具備或者是第三方支援功能領域的知識。為我們更進一步的瞭解到Processing創作的可能性提供了一個更為全面的認知。

歸根到底，創意終究是最重要的。

其他的都只是裝飾而已。

但是，如果連起碼的裝飾都沒有的話，那麼，絢爛的創意也是一片蒼白。

Processing語言相關

Processing語言實際上是一個Java的子集。所以很多方面都可以看到Java的影子。

比如說下面這個稍微複雜點的例子

import gifAnimation.*;
GifMaker gifExport;     // 宣告物件

int [][] grid, futureGrid;

void setup() {
  size(940, 500);
  frameRate(8);

  grid = new int [width][height];           // 目前的影象畫素陣列
 

  futureGrid = new int [width][height];     // 下一刻狀態陣列

  // 設定初始狀態
  float density = 0.3 * width * height;
  for (int i = 0; i < density; i++) {
    grid[int(random(width))][int(random(height))] = 1;
  }

  background(0);

  // 設定gif匯出相關引數
  gifExport = new GifMaker(this, "2D_CA.gif");  
  gifExport.setRepeat(0);          // make it an "endless" animation
  gifExport.setTransparent(0,0,0);  // black is transparent
}

void draw() {
  for (int x = 1; x < width - 1; x++) {
    for (int y = 1; y < height - 1; y++) {
      // “活著的”相鄰細胞數目
      int nb = neighbors(x, y);

      if ((grid[x][y] == 1) && (nb < 2)) {
        futureGrid[x][y] = 0;
        set(x, y, color(0));
      } else if ((grid[x][y] == 1) && (nb > 3)) {
        futureGrid[x][y] = 0;
        set(x, y, color(0));
      } else if ((grid[x][y] == 0) && (nb == 3)) {
        futureGrid[x][y] = 1;
        set(x, y, color(255));
      } else {
        futureGrid[x][y] = grid[x][y];
      }
    }
  }

  int [][] temp = grid;
  grid = futureGrid;
  futureGrid = temp;

  gifExport.setDelay(1);
  gifExport.addFrame();
}

// 統計“活著的”相鄰細胞數目
int neighbors (int x, int y) {
  int north = (y + height - 1) % height;
  int south = (y + 1) % height;
  int east = (x + 1) % width;
  int west = (x + width - 1) % width;
  return grid[x][north] +
         grid[east][north] +
         grid[east][y] +
         grid[east][south] +
         grid[x][south] +
         grid[west][south] +
         grid[west][y] +
         grid[west][north];
}

void mousePressed() {
    gifExport.finish();          // write file
    noLoop();
}

這是一個二維的細胞自動機的例子。只不過在書中原有基礎上添加了點生成gif圖的部分。利用了第三方庫 —— gifAnimathion

import gifAnimation.*;

庫的匯入，物件的宣告

GifMaker gifExport;

都和Java是一致的。類似於Processing的姊妹專案Arduino的程式設計，是由兩個主要的函式 void setup(){}，void draw(){} 構成了程式基本的初始化和自動迴圈。全域性變數需要在外部開頭宣告。

變數宣告，流程控制（書中例程多用迴圈與條件，可見，迴圈判斷才是關鍵）與Java基本一致。

下面說說Processing的簡化後的優勢之處。

書中在附錄詳細比對了設計們常用的幾種語言的關於使用時的簡介程度，當然，Processing自然是最簡單的。畢竟本身就是一門簡化後的語言。基本上所有的編寫核心都是圍繞繪圖控制影象來的。

從最基本的繪製直線，圓，矩形，多邊形等簡單基本圖形，到複雜的改變座標系，以及利用迴圈條件結構進行稍複雜運動的表現，再到通過模仿物理規律從而展現出更為靈活多變的複雜情形，都是可以通過簡單的幾句程式碼來實現的。而且引數的設定也是很有規律的。

比如說這個例子

void setup() {
  size(100, 100);
}

void draw() {
  background(204);
  diagonals(40, 90);
  diagonals(60, 62);
  diagonals(20, 40);
}

void diagonals(int x, int y) {
  line(x, y, x+20, y-40);
  line(x+10, y, x+30, y-40);
  line(x+20, y, x+40, y-40);
}

這段程式碼主要是利用了自定義的函式diagonals()實現了劃線的功能，可以看到，這裡使用的劃線函式line(),用法是極其簡單明晰的。前兩點為起點座標，後兩點為終點座標。兩點定義線段，多麼直接，明確。其他的類似的基礎函式都是差不多的結構與使用方法，所以說，上手的話，看《愛上processing》(密碼: kdg3)基本就夠了。

哦，對，要注意，最基本的是使用二維直角座標系，預設原點為視窗左上角，x軸向右，y軸向下。

Processing的潛力

相較其他語言，Processing設計出來就是為了提供給藝術家們一門簡單直接，又足夠強大的工具來進行創造設計。所以說，註定了它會有很多的擴充套件與延伸。

對的，它有很多功能庫，實現了很多方面的功能。官方有一個庫列表，在其主頁上可以找到。但是使用各種庫的時候，要注意版本。可能會有不相容。

各種各樣的庫實現了各方面的功能。在開頭我提到的2D&3D影象、聲音、視訊、網路、電子&移動裝置等等都有相關的支援。

你甚至可以用它作為Arduino的資料處理前端，因為它可以處理埠的資料。

雖然，它只有一百多個庫，但是，少而精才是現狀，不用擔心社群的力量，只需創意即可。

Processing的難點

利用工具實現靈感的關鍵還是在於用工具的規則去不斷的貼合你的想法。

但是難點就在於如何將腦子裡抽象的靈感，或者是動態的複雜的場景用規則化的，流程化的語言構造出來。這些都是在你實際上手的時候所需要關注的。

就像之前我的一個小嚐試。

float num_lines;  // 連線的數目
float x_0, y_0;   // 連線的起始點

void setup() {
  size(500, 500);
  smooth();
}

void draw() {
  frameRate(10);    // 降低幀率
  background(255);  // 白色背景

  num_lines = random(0, 10);   // 隨機連線數目

  for(int i = 0; i < 1000; i++) {
    point(random(0, 500), random(0, 500));  // 背景隨機點繪製
  }

  for(int i = 0; i < num_lines; i++) {
    x_0 = mouseX + random(-50, 50);
    y_0 = mouseY + random(-50, 50);

    line(x_0, y_0, mouseX, mouseY);   // 滑鼠連線

    noFill();                         // 無填充
    ellipse(mouseX, mouseY, x_0, y_0);// 繪製隨機高寬的圓
  }
}

就是為了實現在背景上週圍隨機出現點，然後令滑鼠附近的幾個點隨機的與滑鼠連線，類似於一些網站頁面裡利用Js實現的那種花哨的顯示效果，可是最後只能做成這個樣子。為了更“花哨”，我又加了一堆隨機的圓。(^__^) 嘻嘻……

Processing權威指南

前面所說，都是我這段時間來學習的一個小的想法的彙總。

實際上，我感覺自己接觸到的只是皮毛，因為語言的使用是要切合實際的應用的，否則也只是空中樓臺，毫無用處。

在這本書裡，後面介紹了一些比較複雜的設計思路，也就是利用了物理數學知識來實現一些更為美妙規律的視覺效果。

實際上，這本書讓我對於這門語言的使用的關鍵——需要結合更為有力，更為邏輯的知識，來實現更為美妙魔幻的構思——有了更為切實的瞭解。而其他的，都是手冊知識而已，總覽全域性後，會查手冊就好。