初探 Processing · 重制版

See the Pen Stripes by HandsomeOne (@handsomeone) on CodePen.


原 Processing 代码丑,勿作参考

Processing 是一种开源编程语言,专门为电子艺术和视觉交互设计而创建,其目的是通过可视化的方式辅助编程教学,并在此基础之上表达数字创意。Processing 语言建立在 Java 语言的基础之上,但使用简化的语法和图形编程模型。

Processing 官网里提供了丰富的 教程样例

我在逛 Windows Store 时,发现了一款“精美、优雅如艺术品的”游戏 Strata – Elegant Puzzler

Strata - Elegant Puzzler

Strata – Elegant Puzzler

受它启发,我试图在 Processing 中实现一个,能基于指定的 行数列数宽度边距阴影深度 ,生成 随机颜色随机“叠放次序” 的彩带的程序。

生成的图像可以作为平铺图案来使用。

实现方法

彩带的条数等于行数加列数,首先生成这么多种随机颜色以备后用。

将每个交点处视作一个单元,每个单元内有两个互相垂直的彩带碎片,连同两边的阴影一起称作 piece。根据位置和方向从先前的颜色列表中决定一种颜色,再随机决定它们的叠放次序。

嵌入至网页

Processing.js 是 JQuery 的创始人 John Resig 的又一力作。它能将 Processing 代码转换为 Javascript,再借助 HTML5 中的 canvas 元素展现出来。以下是“生成”按钮调用的函数:

6 条评论

  1. Helldweller说道:

    是厉害

  2. Irish_cat说道:

    开头的下引号在哪里

  3. 小虾说道:

    看了你的这个很喜欢,请问已经做好了 processing 怎么导入到网页中呢

发表评论

电子邮件地址不会被公开。 必填项已用*标注