04.04.2013 Views

Processing: Creative Coding and Computational Art

Processing: Creative Coding and Computational Art

Processing: Creative Coding and Computational Art

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART<br />

460<br />

One way of keeping the two comm<strong>and</strong>s distinct is to consider the display window function<br />

blend() as a blend involving a background image. <strong>Processing</strong>’s background() comm<strong>and</strong><br />

can take either a color value argument or a PImage argument. If you use an image argument,<br />

the image must be the same size as the display window.<br />

Here’s a sketch that loads an image into the background:<br />

/* image needs to be the same size as the display<br />

window <strong>and</strong> reside in the sketch's data directory */<br />

size(600, 400);<br />

background(loadImage("heidi.jpg"));<br />

The PImage blend() method is used to blend two different PImages together (or one into<br />

itself). One other note, especially for users of early beta versions of <strong>Processing</strong>: to blend<br />

two colors, use <strong>Processing</strong>’s blendColor() or lerpColor() comm<strong>and</strong>s, which are covered<br />

earlier in this chapter. More information about these comm<strong>and</strong>s can also be found within<br />

the language reference, in the Creating & Reading subsection under the Color heading.<br />

The blend() comm<strong>and</strong>s (both the function <strong>and</strong> PImage method) come in two forms:<br />

blend(srcImg, sx1, sy1, swidth, sheight, dx1, ➥<br />

dy1, dwidth, dheight, mode);<br />

blend(sx1, sy1, swidth, sheight, dx1, dy1, ➥<br />

dwidth, dheight, mode);<br />

The only difference between the two forms is that the first version includes a PImage<br />

argument.<br />

The arguments sx1, sy1, swidth, <strong>and</strong> sheight specify the coordinates of the source image<br />

to be used in the blend. The source image can be a section of the image or the entire<br />

image.<br />

The next four arguments, dx1, dy1, dwidth, <strong>and</strong> dheight, specify the coordinates of the<br />

final (or destination) image. These values can be the size of the entire display window or a<br />

section of it.<br />

In the next two sketch examples, I’ll create a simple blend, keeping both the source <strong>and</strong><br />

destination coordinate values the same as the display window size. The first example uses<br />

the blend() function, <strong>and</strong> the second uses the PImage blend() method. Both sketches use<br />

the version of the blend() call that includes a PImage argument, <strong>and</strong> also include the value<br />

DARKEST as the final (mode) argument. I only include one screenshot (see Figure 10-43), as<br />

the two sketches have identical output.<br />

// blend() Function Example sketch<br />

// background image <strong>and</strong> PImage should both be 300 x 400 pixels<br />

size(300, 400);<br />

background(loadImage("airport.jpg"));<br />

PImage img = loadImage("towers.jpg");<br />

blend(img, 0, 0, 300, 400, 0, 0, 300, 400, DARKEST);

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!