Audoballs: Drawing a circle in the display area.

Now that I have a display area I need a circle, which will eventually become my bouncing ball. This looks like:

float xpos, ypos;

void setup() {
size(320, 200);
smooth();
background(255);
}
void draw() {

xpos = width/2;
ypos = height/2;

fill(144);
ellipse(xpos, ypos, 60, 60);
}

I have added a few extra lines in and as you will see below we now have a nice grey circle in the middle of the display area.

float allows you to assign a floating point number to a value. A floating point number has a decimal place in it and allows 'a greater resolution than integers' as is explained here. So float xpos, ypos; is instructing processing that xpos and ypos are floating point numbers.

the draw() command is used after setup and continuously executes the code within. Explanation here

So within the draw command I am basically doing 4 things. I am saying that "xpos" has the value of the width divided by 2. I am saying that the 'ypos" has the value of the height divided by 2.

I am then saying the colour of the fill of the ellipse is (144), a grayscale colour. (/shade, grey isn't really a colour)

Then I am instructing it to draw an ellipse(x, y, width, height) - the brackets contain the properties of the ellipse.

The result of this is: