Learning Processing – Code Bits ( for @cawsand )

I’ve been teaching a little bit of Processing online via Skype lately and used these two simple bits of code to introduce variables and the structure of a processing sketch. Take a look and please don’t hesitate to get in touch if you have any questions.

Example 1 – Talking about the structure of a processing sketch

void setup() {
size(400,400);

}

void draw() {
stroke(255);

// mouseX is left and right
// mouseY is up and down
line(20,20,mouseX,mouseY);
//rect(mouseX,mouseY,10,10);
}

void mousePressed() {
background(192,64,0);
}

Example 2 – beginning to talk about repetition and incrementing variables

size(640, 360);

// These are my variables for size & colour
int my_width = 600;
int my_height = 25;
int color_r = 100;
int color_g = 0;
int color_b = 50;
int location_y = 20;

// This is where I draw things
fill(color_r,color_g,color_b); // fill(red,green,blue);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;
fill(color_r,color_g,color_b);
rect(20,location_y,my_width,my_height);
location_y = location_y+30;
color_g = color_g +20;