【02】processing-概述(中文)
作者
Ben Fry 和 Casey Reas:
Processing是一种简单的编程环境,其创建目的是使开发更容易开发面向视觉的应用程序(重点是动画)并通过交互为用户提供即时反馈变得更加容易。开发人员想要一种“素描”代码中想法的方法。随着其功能在过去十年中的扩展,Processing除了具有素描功能外,还被用于更高级的生产级工作。
最初是作为针对艺术家和设计师的Java特定于领域的扩展而构建的,Processing已经发展成为一种成熟的设计和原型制作工具,用于大规模安装工作,运动图形和复杂的数据可视化。
Processing是基于Java的,但是由于程序元素相当简单,因此即使您不懂Java也可以学习使用它。如果您熟悉Java,那么最好暂时忘记处理与Java有任何关系,直到您掌握了API的工作原理为止。
http://processing.org/download下载最新版本的Processing。
该项目的重要目标是使更广泛的受众可以访问这种类型的程序。因此,Processing是免费下载,免费使用和开源的。但是使用Processing环境和核心库开发的项目可以用于任何目的。此模型与GCC GNU编译器集合相同。 GCC及其关联的库(例如libc)是GNU公共许可证(GPL)下的开放源代码,其中规定必须对代码进行更改。但是,使用GCC创建的程序(示例不胜枚举)本身并不是开源的。
Processing 包含:
- 开发环境(PDE)。 双击“processing”图标时运行软件。 PDE是一个集成开发环境(IDE),具有一组简约的功能,这些功能被设计为编程的简单介绍或用于测试一次性想法的功能。
- 组成“核心”编程接口或API的功能(也称为命令或方法)的集合,以及支持更高级功能(例如,通过网络发送数据,从网络摄像头读取实时图像)的多个库 ,并以PDF格式保存复杂的图像。
- 一种语言语法,与Java相同,但进行了一些修改。
- 一个活跃的在线社区,http://processing.org
因此,对“processing”的引用可能有些含糊。 我们是在谈论API,开发环境还是网站? 在引用每个文本时,我们将格外小心。
草图
processing程序称为草图。 这个想法是使Java风格的编程更像脚本,并采用脚本过程来快速编写代码。 草图存储在草图簿中,该簿册是一个文件夹,用作保存所有项目的默认位置。 可以从【文件 → 草图簿】中访问存储在草图簿中的草图。 或者,可以使用【文件 → 打开】...从系统的其他位置打开草图。
高级程序员无需使用PDE,而是可以选择将其库与所选的Java环境一起使用。 但是,如果您只是入门,建议您在前几个项目中使用PDE,以熟悉操作方式。 虽然Processing是基于Java的,但它绝不是要成为具有培训能力的Java IDE。 为了更好地面向目标受众,概念模型(程序如何工作,界面如何构建以及文件如何处理)与Java有所不同。
大家好
只是画一条线:
line(15, 25, 70, 90);
输入此代码,然后按“运行”按钮,该按钮看起来像任何音频或视频设备中的“播放”按钮。
您的代码将显示在新窗口中,带有灰色背景和从坐标(15,25)到(70,90)的黑线。
(0,0)坐标是显示窗口的左上角。在此程序的基础上更改显示窗口的大小并设置背景颜色,请输入以下代码:
size(400, 400); background(192, 64, 0); stroke(255); line(150, 25, 270, 350);
窗口大小设置为400 x 400像素,
背景颜色设置为橙红色
绘制线条颜色设置为白色
绘制线条起始点(150,20),结束点(270,350)
默认情况下,颜色的指定范围是0到255。
stroke()函数的参数的其他变体提供了替代结果:
stroke(255); // 设置边框颜色为 白色 stroke(255, 255, 255); // 设置边框颜色为(红色=255,绿色=255,蓝色=255) stroke(255, 128, 0); // 设置边框颜色为(红色=255,绿色=128,蓝色=0) stroke(#FF8000); // 设置边框颜色为 十六进制颜色 stroke(255, 128, 0, 128); // 设置边框颜色为(红色=255,绿色=128,蓝色=0,透明度=128)
对于fill()函数(用于设置填充颜色)
background()函数(用于清除显示窗口),可以使用相同的替代方法。
像所有影响图形属性的处理功能一样,填充和描边颜色会影响绘制到屏幕上的所有几何图形,直到下一个填充和描边功能。
鼠标
以语句列表形式编写的程序(如前面的示例一样)称为静态草图。
在静态草图中,一系列功能用于执行任务或创建单个图像,而无需任何动画或交互。
交互式程序被绘制为一系列框架,您可以通过添加标题为setup()和draw()的函数来创建它们,
如下面的代码所示。 这些是自动调用的内置函数。
void setup() { size(400, 400); background(192, 64, 0); } void draw() { stroke(255); line(150, 25, mouseX, mouseY); }
setup()运行一次,而draw()重复运行。
setup()可以用于任何初始化。 设置屏幕尺寸,将背景设为橙色,并将笔触颜色设置为白色。
size()函数必须始终是setup()中的第一行。
draw()块用于处理动画。
由于background()函数仅使用一次,因此在移动鼠标时,屏幕将用线条填充。
要仅绘制跟随鼠标的一行,请将background()函数移至draw()函数
每次draw()运行时清除显示窗口(用橙色填充)。
void setup() { size(400, 400); } void draw() { background(192, 64, 0); stroke(255); line(150, 25, mouseX, mouseY); }
静态程序最常用于极其简单的示例,或者用于以线性方式运行然后退出的脚本。
例如,静态程序可能会启动,将页面绘制为PDF文件,然后退出。
大多数程序将使用setup()和draw()块。 还可以引入更高级的鼠标处理方式。
例如,每当按下鼠标时都会调用mousePressed()函数。
在下面的示例中,当按下鼠标时,通过background()函数清除屏幕:
void setup() { size(400, 400); } void draw() { stroke(255); line(150, 25, mouseX, mouseY); } void mousePressed() { background(192, 64, 0); }
分享
processing环境最重要的功能之一就是能够一键将草图捆绑到应用程序中。
选择【文件→导出应用程序】以将当前草图打包为应用程序。
这会将您的草图捆绑为Windows,Mac OS X或Linux的应用程序,具体取决于要从哪个操作系统导出。
每次导出时,应用程序文件夹都会被覆盖-在更改文件夹的内容之前,将其复制或从草图文件夹中删除。
或者,您可以在“首选项”中关闭自动文件擦除。
有关导出功能的更多信息,请参见以下参考资料:http://processing.org/reference/environment/#Export
保存图片
如果您不想分发实际的项目,则可能要创建其输出的图像。
图像使用saveFrame()函数保存。
在draw()的末尾添加saveFrame()将产生程序输出的一系列TIFF格式图像,分别名为screen-0001.tif
每次draw()运行时,都会保存一个新文件-注意,这可以迅速将数百个文件填充到您的草图文件夹中。
您还可以使用以下功能为要保存的文件指定自己的名称和文件类型:
saveFrame("output.png");
要对带编号的序列执行相同的操作,请在应放置数字的位置使用#(井号):
saveFrame("output-####.png");
为了获得高质量的输出,您可以将几何图形写入PDF文件而不是屏幕中,如稍后有关size()函数的部分所述。
实例/参考
当许多程序员在学校学习代码时,其他人则自学。独立学习包括查看许多其他代码:运行、修改、破坏和增强代码,直到可以将其重塑为新的代码。考虑到这个学习模型,下载的处理软件包括数百个示例,展示了环境和API的不同特性。
可以从【文件→范例程序】访问示例。它们根据功能(如运动、排版和图像)或它们使用的库(PDF、网络和视频)被分为不同的类别。
在列表中找到一个有趣的主题并尝试一个示例,您将看到熟悉的函数,例如stroke()、line()和background(),以及其他尚未介绍的函数。
要查看函数的工作方式,请选择其名称,然后右键单击并从弹出菜单中选择“在参考文档中搜索”
也可以在“帮助”菜单下找到“在引用中查找”。这将在默认web浏览器中打开该函数的引用。
除了对函数(功能)语法的描述外,每个引用页还包含一个使用该函数(功能)的示例。与较长的代码示例相比,引用示例要短得多(通常是每行四到五行),而且更容易理解。
size()简介
函数(功能)的作用是:设置全局变量宽度和高度。
(对于大小取决于屏幕的对象,始终使用宽度和高度变量而不是数字。这可以防止更改size()行时出现问题。)
size(400, 400); //指定屏幕中间的错误方法 ellipse(200, 200, 50, 50); // 始终位于中间,无论size()行如何更改 ellipse(width/2, height/2, 50, 50);
在前面的示例中,size()函数只为要创建的窗口指定了宽度和高度。size()函数的可选参数指定图形的呈现方式。渲染器处理如何为特定输出函数(无论是屏幕,还是由高端图形卡驱动的屏幕,或PDF文件)实现处理API。
默认的渲染器在处理高质量的二维矢量图形方面做得很好,但代价是速度。特别是,直接使用像素是很慢的。处理过程中还包括其他几个渲染器,每个渲染器都有一个唯一的函数。冒着过于深入了解细节的风险,下面将介绍处理过程中使用的其他可能的绘图模式。
size(400, 400, P2D);
P2D渲染器使用OpenGL快速渲染二维图形,同时使用Processing的简单图形api和Processing开发环境的简单应用程序导出。
size(400, 400, P3D);
P3D渲染器使用OpenGL进行快速渲染。它可以在空间中绘制三维对象和二维对象,也可以绘制照明、纹理和材质。
import processing.pdf.*; size(400, 400, PDF, "output.pdf");
PDF渲染器将所有几何图形绘制到一个文件,而不是屏幕。要使用PDF,除了更改size()函数外,还必须从“草图”菜单中选择“导入库”,然后选择“PDF”。这是默认渲染器的堂兄弟,但直接写入PDF文件。
加载和显示数据
处理API的一个独特方面是处理文件的方式。
loadImage()和loadStrings()函数都希望在名为data的文件夹中找到一个文件,该文件夹是sketch文件夹的子目录。
高级主题:关于数据文件夹的说明
当处理本地测试但部署在web上的代码时,data文件夹解决了一个常见的问题。与Java一样,用处理方式编写的软件也受到安全限制,这些限制决定了程序如何通过网络访问本地硬盘或其他服务器等资源。这可以防止恶意开发人员编写可能危害计算机或数据的代码。
在开发过程中,安全限制可能很难处理。在本地运行程序时,可以直接从磁盘读取数据,但数据必须相对于用户的“工作目录”(通常是应用程序的位置)放置。联机运行时,数据必须来自同一服务器上的某个位置。它可能与代码本身捆绑在一起(在JAR存档中,稍后讨论;或者来自同一服务器上的另一个URL)。对于本地文件,可以使用Java的FileInputStream类。如果文件捆绑在JAR存档中,则使用getResource()函数。对于服务器上的文件,可以使用URL.openStream()。在从开发到部署的过程中,可能需要使用所有这三个功能。
通过processing,每个场景(以及其他一些场景)都由文件API函数透明地处理。通过将资源放置在数据文件夹中,处理将文件打包以供联机和脱机使用。
loadStrings()(将文本文件读入字符串对象数组)
loadImages()(将图像读入正在处理的图像数据容器PImage对象)
// 从程序目录文件夹中的data文件夹中,加载文本文件和JPEG图像的示例 String[] lines = loadStrings("something.txt"); PImage image = loadImage("picture.jpg");
如果您了解数据类型和类的编程概念,那么这些示例可能更容易阅读。每个变量都必须有一个数据类型,如String或PImage。String[]语法表示“类String的数据数组”。这个数组是由loadStrings函数创建的,并被赋予了名称;它可能会在以后的程序中以这个名称使用。loadStrings创建数组的原因是它将something.txt文件拆分为单独的行。下面的函数创建一个名为image的PImage类变量。
若要将文件添加到处理草图的数据文件夹中
- 请使用“速写本→添加文件”菜单选项
- 或将文件拖动到PDE的编辑器窗口中。如果数据文件夹不存在,将自动创建它。
要查看“速写本”文件夹的内容,请使用“草图→打开程序目录”菜单选项。
库中添加新功能
库是指定格式的代码集合,使其易于在处理过程中使用。库对于项目的增长非常重要,因为它们让开发人员可以让用户访问新功能,而无需将它们作为核心处理API的一部分。
几个核心库附带处理。这些库可以在联机参考的“库”部分中看到(也可以从PDE中的“帮助”菜单中获得)http://processing.org/reference/libraries/
一个例子是PDF导出库。这个库使直接从处理中写入PDF文件成为可能。这些矢量图形文件可以缩放到任何大小并以非常高的分辨率输出。若要在项目中使用PDF库,请选择“速写本→引用库文件→PDF”。这将在草图顶部添加以下行:
import processing.pdf.*;
Java程序员将识别import命令。在处理过程中,这一行还用于确定当导出为applet或应用程序时,哪些代码与草图一起打包。既然导入了PDF库,就可以使用它创建文件。例如,下面的代码行创建了一个名为lines.PDF的新PDF文件,您可以将其绘制到该文件中。
beginRecord(PDF, "lines.pdf");
每个绘图函数,如line()和elliple()现在将绘制到屏幕和PDF。其他库提供了一些功能,例如从相机读取图像、发送和接收MIDI和OSC命令、复杂的3D相机控制以及对MySQL数据库的访问。
草图和脚本
处理草图由一个或多个选项卡组成,每个选项卡代表一段代码。该环境是围绕几个代码页的项目设计的,通常总共有三到五个选项卡。这涵盖了为测试和原型思想而开发的大量项目,通常是在将它们嵌入到更大的项目或构建更健壮的应用程序以进行更广泛的部署之前。
草图的思想与脚本的思想是相同的,只是您不是在使用解释性脚本语言,而是在编译为Java类文件时获得性能优势。当然,严格地说,Java本身就是一种解释性语言,但是它的字节码编译使它比JavaScript、Python或Ruby等语言更接近“metal”编程语言。
处理从来没有打算作为编程视觉效果的最终语言;相反,我们开始做一些事情:
- 为我们自己的工作,简化我们承担的大部分任务的速写本。
- 适合向非传统观众教授节目的节目环境。
- 从脚本语言到更复杂或困难的语言如全面java或C++的垫脚石。
在这些点的交叉点是速度和简单使用之间的折衷。如果我们不关心速度,那么使用Python、Ruby或许多其他脚本语言可能是有意义的。教育方面尤其如此。如果我们不关心向更高级语言过渡,我们可能会避免使用C++或java风格的语法。但是java为草图语言提供了一个很好的起点,因为它比C++更容易宽恕,也允许用户通过网络导出草图进行分发。处理过程汇集了我们在构建此类软件(交互式作品草图或数据驱动可视化)方面的经验,并简化了我们认为应该更容易的部分,例如快速入门,以及将新用户与设置Java相关的问题隔离开来。
不要一开始就想建造一座大厦
如果您已经熟悉编程,那么理解处理与其他开发环境和语言的区别是很重要的。处理项目鼓励一种快速构建代码的工作方式,理解代码将被用作快速草图,或者在开发最终项目之前正在测试想法。这可能被误解为软件工程异端。也许我们离“黑客”不远,但这更适合于使用处理的角色。为什么要强迫学生或临时程序员在屏幕上显示与鼠标交互的内容之前先学习图形上下文、线程和事件处理函数?高级开发人员也是如此:为什么他们在开始一个项目时总是需要从相同的两页代码开始?
在另一个场景中,快速尝试的能力远高于复杂的代码结构。通常你不知道结果会是什么,所以你可能会在一周内建立一些东西来尝试一个最初的假设,然后在下一周根据第一周所学的知识建立一些新的东西。为此,在开始编写处理代码时请记住以**意事项:
- 在代码中创建不必要的结构时要小心。当您学习如何将代码封装到类中时,很容易创建更小的类,因为数据总是可以进一步提取的。你需要分子、原子或夸克级别的课程吗?原子变小并不意味着我们需要在较低的抽象层次上工作。如果一个类只有半页,那么有六个额外的子类,每个子类都有半页长,这有意义吗?如果一个类总共是一页半,同样的事情能完成吗?
- 考虑一下这个项目的规模。在第一天构建企业级软件并不总是必要的。首先探索:找出帮助回答问题和满足好奇心所需的最少代码。
争论的焦点不是避免不断地重写,而是推迟工程工作直到合适为止。从哪里开始设计一个软件的门槛比传统的编程项目要晚得多,因为快速迭代的早期过程有一种艺术。当然,一旦事情进展顺利,就要避免为了自己的利益而重写的冲动。当处理完全不同的问题时,应该使用重写。如果你已经做到了一针见血,你应该重构来清理函数名和类交互。但是,完全重写已经完成的代码几乎总是一个坏主意,不管它看起来多么“简单粗暴”。