Processing: Creative Coding and Computational Art

void setup(){
size(400, 400);
// initialize x, y
x = width/2.0;
y = height/2.0;
rectMode(CENTER);
}
void draw(){
background(255);
rect(x, y, w, h);
if (mousePressed){
x = mouseX;
y = mouseY;
}
}
This may seem confusing if you’re a new coder—why have two ways of doing the same
thing? Well, if you run this last example, you’ll notice that the two sketches actually don’t
run quite the same way. This last example updates the rectangle’s x and y positions continuously
while the mouse is pressed, allowing the rectangle to be dragged in the display
window. The earlier example only updated the rectangle when the mouse was pressed. As
you look at some more complex examples, it will become clearer how these two
approaches differ.
Notice also when I checked the condition (true or false) of the mousePressed Boolean
variable, I just included it between the parentheses: (mousePressed). I didn’t explicitly
check if it was true using (mousePressed == true). This shortcut is perfectly legal, since
the Boolean value will evaluate to either true or false, which is what the if statement
needs to know in determining whether it should execute the code between its curly
braces.
In addition to mouse press events, you can detect mouse release events. Here’s an
example:
// mouseReleased
// example 1
// declare x, y
float x, y;
// declare and initialize w, h
float w = 20.0, h = 20.0;
// rectangle fill color variable
color rectColor = color(255, 255, 255);
void setup(){
size(400, 400);
// initialize x, y
x = width/2.0;
INTERACTIVITY
567
12