Processing 102, videos 1-2

Now that we’ve seen the basics of Processing, we’ll take a quick look at the simplest-possible “bouncing ball” application. We can get into more complex examples in the future, but for now lets stick to the basics: updating a circle’s location at a constant velocity.

Second video here:

Code:
Note: I recommend typing this out yourself, not copy-paste. The only way to learn a language is to use it, and copy-paste programming won’t get you there.

float xPos;
float yPos;

float xVel;
float yVel;

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

xPos = width/2;
yPos = height/2;
xVel = 1;
yVel = 2;
}

void draw() {
background(255);

xPos = xPos + xVel;
yPos = yPos + yVel;

if ( yPos + 30 > height || yPos – 30 yVel = yVel * -1;
}

if ( xPos + 30 > width || xPos + 30 xVel = xVel * -1;
}

fill(0); noStroke();
ellipse(xPos,yPos,60,60);
}