Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
568
y = height/2.0;
rectMode(CENTER);
}
void draw(){
background(255);
fill(rectColor);
rect(x, y, w, h);
}
void mousePressed() {
x = mouseX;
y = mouseY;
}
// randomly change fill color upon mouse release
void mouseReleased() {
rectColor = color(random(255), random(255), random(255));
}
In this example, I included the original mousePressed() function and added a
mouseReleased() function. When you run the sketch, you’ll see that Processing can detect
both parts of the mouse click (the press and release) as separate events. The
mouseReleased() function creates a random color for the rectangle’s fill.
If you’re a detail-oriented person (I’m really not), you may have noticed some inconsistency
with Processing’s automatic syntax color highlighting in the text editor. In
general, Processing’s built-in functions turn orange, while built-in variables turn red.
However, the mousePressed() function turns red, and the mouseClicked() function
remains black. The other mouse event functions, mouseReleased(), mouseMoved(),
and mouseDragged(), turn orange. This is definitely confusing, and I’ve seen comments
on the Processing discussion board saying so as well. Perhaps at some point this
minor issue will be addressed; for now, just realize that it’s not something you’re doing
wrong, and that the color of your code in the text editor has no effect on the functionality
of the code. (It’s also possible that by the time you read this, the issue will
have been resolved.)
The mouseMoved() and mouseDragged() functions work similarly to mousePressed() and
mouseReleased(). Here’s a mouseDragged() example:
// mouseDragged Example
float x, y;
// declare and initialize radius
float r = 5.0;
void setup(){
size(400, 400);