Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
440
Display window functions
The commands grouped under the Pixels heading of the language reference are functions
that affect the pixels in the display window, regardless of whether those pixels make up a
background color or an image. The pixels[] array specified under this heading is the
array that holds all the pixels making up the display window (again, regardless of what’s
in it).
PImage methods
The PImage data type also has a pixels[] array property that is assigned the pixels making
up the created PImage object. When invoking a method of the PImage class, you use a
PImage object reference attached to the property or method with dot syntax. For example,
to set a pixel of a PImage named img, you would write img.set(). In contrast, to set a pixel
in the display window, you would just use set(). The situation can seem even more confusing
once img (the PImage object) is drawn to the screen. At that point, the image data
becomes part of the display window, which gets collected in the window’s pixels[] array.
However, img still retains its original pixel data in memory (in its own img.pixels[] array).
The next sketch, shown in Figure 10-28, uses the PImage method get() to create a pixilated
image. The variable detail allows you to change the level of pixilation. The original
PImage is never drawn to the screen, but rather the internal image is used for picking color
values with the PImage get() method. The picked color values are then used to create a
matrix of colored rectangles approximating the image. If you bring the level of detail down
to (or near) 1, the colored rectangles will approximate a continuous tone image; you’ll also
want to uncomment the line //noStroke();. I recommend using an image the same size
as the display window.
//Pixilate
size(600, 400);
PImage img = loadImage("changsha.jpg");
//noStroke();
int detail = 10;
for ( int i=0; i