Processing入坑小记

最近因为入手了一个Xbox kinect，于是有想做个互动项目，因为接触了Arduino的缘故，所以目标首先锁定在了processing上，processing C因为和arduino C是近亲，也因此学起来没有什么难度，感觉和arduino C一样。

Processing免费供设计爱好者们下载使用，官网：https://processing.org

1、Processing 环境：

第一步是安装 Processing 环境。去到 Processing.org（https://processing.org/download/），单击 Download Processing 并选择您的操作系统。此外，还需要确保 Java 技术已经可用。在windows上，下载解压后直接运行processing.exe即可。

这应该会弹出 Processing Development Environment（PDE 或 Processing IDE），如图 1 所示。占此窗口较大的部分是文本编辑器。如果输入图中所示的两行代码，然后单击 Run（左上角的三角形），出现一个窗口，显示您所输入的简单程序（或 Processing 术语所指的 sketch）的结果。单击 Stop（左上角的方框）退出程序，窗口消失。

2、Processing 语言
Processing 是用 Java 编程语言写的，并且 Java 语言也是在语言树中最接近 Processing 的。所以，如果您熟悉 C 或 Java 语言，Processing 将很容易学。并且在程序如何构造方面，也作了一些简化。Processing 并不包括 Java 语言的一些较为高级的特性，但这些特性中的很多特性均已集成到了 Processing， 所以您无需了解它们。

之所以选择 Java 语言是因为 Processing 应用程序被翻译成 Java 代码执行。选择 Java 范型简化了这种翻译并让开发和执行可视化程序变得十分简单和直观。

3、图形环境

在 Processing 内进行开发涉及到的是 PDE 和显示窗口。2-D 图形的坐标系如图 2 所示。size 关键字以像素为单位定义了显示窗口的大小并且通常都是 Processing 应用程序内的首要步骤。

如图 2 所示，size 关键字指定显示窗口的 X 和 Y 坐标。line 关键字则会在两个像素点之间绘制一条线（以 x1、y1 to x2、y2 的格式）。请注意，超出屏幕边界（size 定义的边界外）画线并非不允许，只是被忽略了而已。

本文无意对此做深入探讨，但 size 接受可选的第三个参数 mode。 mode 用来定义要使用的呈现引擎并支持 PDF（直接呈现为 Adobe® PDF 文档）、OPENGL （利用一个可用的 Open-GL 图形适配器）、P3D（为了迅速的 3-D 呈现）等。默认的是 JAVA2D，它最适合于高质量的 2-D 成像。

现在，我们来看一些基本的图形原语，然后再深入探讨几个示例应用程序。

4、图形原语

Processing 包含了大量各种各样的几何形状以及这些形状的控件。本节会简介一些基本的图形原语。

1）背景和颜色
background 功能被用来设置显示窗口的颜色。此函数可以使用各种不同的参数（来定义一个灰度值或 Red-Green-Blue [RGB] 颜色）。

3）绘制形状

在 Processing 内使用单个函数绘制形状十分简单。要设置在绘制形状时使用何种颜色，可以利用 stroke 函数。此函数可接受一个单独的灰度参数或三个 RGB 参数。此外，还可以用 fill 命令定义这个形状的填充色。

下面代码显示了如何绘制线、矩形、圆（使用椭圆）及椭圆。line 函数接受四个参数，代表的是要在其间绘制线条的点。rect 函数可绘制一个矩形，并且前两个点定义位置，而后面两个点则分别定义宽度和高度。ellipse 函数也接受四个参数，分别定义位置和宽/高度。当宽和高相等时，就是一个圆形。还可以使用 ellipseMode 函数定制椭圆，它指定 x,y 位置是否代表了椭圆的角（CORNER）或中心（CENTER）。

4) 显示一段文字

[mw_shl_code=applescript,true]void setup()
{
size(500,500);
background(150);
smooth();
}
void draw()
{
background(150);
String myString = "I love China, wish it'll be prospect forever.";
textAlign(CENTER);
textSize(40);
fill(0,0,0);
text(myString,20,height/8,400,420);
}[/mw_shl_code]

5） 用鼠标画任意彩色圆圈

[mw_shl_code=applescript,true]void setup()
{
size(850,1100);
background(255);
}
void draw()
{
//no code needed here!
}
void mouseDragged()
{
strokeWeight(150);
stroke(random(255),random(255),random(255));
line(pmouseX,pmouseY,mouseX,mouseY);
}[/mw_shl_code]