After opening up processing and exploring the various examples provided, I stumbled upon one called “Color Variables”. It reminded me of my Albers project from last year and as I started to poke around the code I had an idea. I wanted to get a better grasp of event triggers with Processing—specifically using if statements and loops. At first, I couldn’t seem to get the code to work. Then I realized that I needed to use void draw() to run a constant loop, otherwise the if statement I wrote would never be checked after initialization. Below is my code, it uses a simple integer binary (see void mouseClicked) to check if the mouse has clicked or not, and changes the color variables accordingly. I also changed one of the shapes by changing 'rect' to 'ellipse'.
 |
| Before. This is what the original code did. |
 |
| After! This is what edited my code does. |
/**
* Color Variables (Homage to Albers).
*
* This example creates variables for colors that may be referred to
* in the program by a name, rather than a number.
*
* Edited by Jacob Elias as an exploration in Processing.
*/
int toggle = 0;
color inside = color(204, 102, 0);
color middle = color(204, 153, 0);
color outside = color(153, 51, 0);
void setup(){
size(640, 360);
noStroke();
background(51, 0, 0);
}
void draw(){
if (toggle == 1) {
inside = color(#057DBA);
middle = color(#009BE6);
outside = color(#0057E8);
background (#18639D);
} else {
inside = color(204, 102, 0);
middle = color(204, 153, 0);
outside = color(153, 51, 0);
background (51, 0, 0);
}
//These statements are equivalent to the statements above.
//Programmers may use the format they prefer.
pushMatrix();
translate(80, 80);
fill(outside);
ellipse(100, 100, 200, 200);
fill(middle);
ellipse(100, 100, 145, 145);
fill(inside);
ellipse(100, 100, 80, 80);
popMatrix();
pushMatrix();
translate(360, 80);
fill(inside);
rect(0, 0, 200, 200);
fill(outside);
rect(40, 60, 120, 120);
fill(middle);
rect(60, 90, 80, 80);
popMatrix();
}
void mouseClicked () {
if (toggle == 0) {
toggle = 1;
} else {
toggle = 0;}
}
