In the previous examples we have written programs without functions. These programs were not interactive and do not include animations. So how can you extend a program so that, for example, the keyboard is used as an input? The answer is to use program events, which are recorded and forwarded by the program. Here is a short list of some such events:

• program start
• Output to the window
• keyboard input
• mouse input

These events can be intercepted. To do this, we only need to write functions (with names defined by processing) that are called automatically for the respective events.

• setup ->  Programme start
• draw -> Refresh of the output window
• keyPressed -> keyboard press
• mousePressed -> Mause button press

Let's take the Example 1 and expand it to use events:

void setup()
{
  size(300,300);
  smooth();
  stroke(255,255,255);
}
 
void draw()
{
  background(0);
 
  strokeWeight(1);
  line(100,10,100,150);
  line(150,10,150,200);
  line(200,10,200,250);
 
  fill(0,0,0);
  strokeWeight(5);
  ellipse(100,150,50,50);
  ellipse(150,200,50,50);
  noFill();
  ellipse(200,250,50,50);
}

In this program we use two functions:

• void setup ()
• void draw ()

These functions have no parameters and no return value, so only the 'void' is replaced by the return type. The function names are reserved names that processing knows, so Processing calls these functions as soon as the corresponding event occurs.

Further functional examples

This example shows how to write functions with return values.

void setup()
{
  println(addition(1,2));
  println(addition(2,10));
}
 
int addition(int parameter1, int parameter2)
{
  return parameter1 + parameter2;
}

This example shows how to use functions around the code of legible and simple shapes (modularization).

void setup()
{
  size(300,300);
  smooth();
  stroke(255,255,255);
  noFill();
}
 
void draw()
{
  background(0);
 
  bommel(100,10,140,50);
  bommel(150,10,190,50);
  bommel(200,10,240,50);
}
 
void bommel(int x,int y,int length,int size)
{
  strokeWeight(1);
  line(x,y,x,y+length);
  strokeWeight(5);
  ellipse(x,y+length,size,size);
}

And here is our first interactive program:

void setup()
{
  size(300,300);
  background(0);
}
 
void draw()
{}
 
void mousePressed()
{
  println("x:" + mouseX + ", y:" + mouseY);
}

Exercise

Create a Programm where a unique shape follows the mouse position.