Processing: Creative Coding and Computational Art

Image
The Image section relates very directly to the information I covered in the Color section, as
an image after all is a just a collection of colored pixels. In general, the image functions
allow you to load and alter images. In Java, loading images and altering them is real work
(especially down at the pixel level). Processing, as usual, simplifies this entire process, while
still giving you enough low-level access to act directly upon the pixel data. Processing also
includes its own image data type, called PImage, that encapsulates many of the features,
which makes working with images in Processing so easy. Yet, for all its ease of use,
Processing’s imaging capabilities are surprisingly powerful.
The Image section of the API is divided up into essentially two categories, with the PImage
data type and createImage() function standing alone. The two categories are Loading &
Displaying and Pixels. Be aware that PImage includes a bunch of methods with the same
names as some of the functions in the Pixels section. For instance, following is an example
that uses the PImage method get() and the function get() in the same sketch. Even
though these commands are both called get(), they are fundamentally different. The
get() method requires a PImage object to call it—as in myImage.get()—while the get()
function works all by itself. The subtlety of this distinction requires an understanding of
OOP, which is covered in Chapter 8.
You’ll need an image named portrait.jpg in the data directory of this sketch to run this
example. I suggest making the image 400 by 400 pixels.
size(400, 400);
PImage img = loadImage("portrait.jpg");
image(img, 0, 0);
println("image method before = " + img.get(50, 50));
println("function before = " + get(50, 50));
image(img, -140, -140);
println("image method after = " + img.get(50, 50));
println("function after = " + get(50, 50));
Here’s the output generated by running the sketch:
image method before = -263171
function before = -263171
image method after = -263171
function after = -5686717
Your values will be different, since your image will be different than mine—but notice how
the output changes for the function, but not for the method. What’s happening is that the
PImage get() method references the image data stored in the PImage object independently
from its display on the screen, while the get() function returns pixel values at a specific
point on the screen. Since I drew the image at two different places on the screen, the
two get() function calls give two different values. However, the two get() method calls
refer to the same pixel in the stored PImage object.
PROCESSING LANGUAGE API
731
A