Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
478
The calling PDE code should be old hat by now. I simply created a bunch of color and
Rectangle objects and passed them to the respective gradient constructors. Both the
LinearGradient and RadialGradient default constructors fill the entire screen with a
black-and-white linear or radial gradient, respectively. I used the former to create a background
gradient. Notice the Gradient.AXIS_HORIZONTAL argument in two of the
LinearGradient instantiation calls. This is a standard use of a constant. I used the class
name to preface the constant name, as you’ll remember that the constant was declared as
a static property in the Gradient class.
In running this example, you have two options: you can type all the code (the three classes
and the main PDE code just shown) into Processing, or you can download the complete
code from www.friendsofed.com/downloads.
Organizing classes using multiple tabs
Once you’ve got all the code, there are two ways you can organize it in Processing. The
first and simplest way is to add all the code (including the classes) directly into the main
(leftmost) tab. This is the approach you’ve been using thus far in the book. A better and
more organized way is to enter only the PDE code in the main tab and then create new
tabs for each of the three classes. Assuming that you have all your code pasted in the main
tab, here are the steps to reorganize it across multiple tabs.
Select all the code of the Gradient class and cut it—you can either use the Copy command
under the Edit menu or the common shortcut Cmd+C (on the Mac)/Ctrl+C
(on Windows). Then click the tabs arrow at the right side of the Processing window, and
select New tab. Give the file the same name of the class (Gradient). When the new tab
opens, paste the Gradient class code into the window. Repeat this process for the
LinearGradient and RadialGradient classes. When you have the classes safely pasted
into their own tabs, delete the class code in the main tab (the leftmost one), but make
sure you keep the remaining PDE code (including the setup() function). You should be
able to run the sketch now.
One final note on the tabs: when you name the individual tab documents, you don’t need
to include the .pde suffix, as Processing does it automatically. If you do include it, that’s
OK as well, as Processing is smart and will not append a second suffix. You can also create
separate tabs for functions, following the same procedure I just outlined.
Summary
This has been a big chapter with some challenging—but also hopefully interesting—
information and snippets. It began with a look at basic color theory, which you applied
using Processing’s built-in color capabilities, including selecting between color models and
working with Processing’s color data type. I discussed the Java graphics context and its
connection to how painting occurs in Processing and Java, and I briefly discussed
Processing’s sophisticated matrices functions and how to specifically push and pop translations,
as well as reset a matrix with the identity matrix.