Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
434
In addition to loadImage(), you can use the image() function to actually draw the image
to the screen, as in the line image(img1, 0, 0);. The second and third arguments in the
call (0, 0) are for the x and y position of the image. Images are positioned from the topleft
corner of the image. In the last example, if I had wanted to center the image in the display
window (assuming, of course, that the image was smaller than the window), I could
have used the following:
//load and center an image
size(700, 500);
PImage img1;
img1 = loadImage("heidi.jpg");
translate(width/2, height/2);
image(img1, -img1.width/2, -img1.height/2);
Since PImage is a data type (think class), it includes properties (also referred to as fields)
and methods. PImage objects have width and height properties, which I conveniently used
in calculating the image position (centered). More information about the PImage data type,
including its other fields/methods, can be found at http://processing.org/reference/
PImage.html.
In the last example, I called the image() function to display my image. set() can also be
called to load images—in this case, two copies of the same image—the same function
called earlier to change the color of a pixel (see Figure 10-24):
//Loading Images with set()
size(600, 400);
background(245);
PImage img2 = loadImage("kids.jpg");
set(50, 50, img2);
set(img2.width+100, 50, img2);
Figure 10-24. Loading Images with set() sketch