Something that you will use quite often when programming are variables. They are a kind of container for different types of data. For each variable you need to specify the type of data it will contain, the name of the variable, and the value to assign to it.

Think of them as jars. Say that you have two jars; one for cookies and one for words – these would be like data types. You give each jar a name; cookieJar and jarOfWord. Then you decide what to put in each jar. In cookieJar you put a double chocolate chip cookie and in jarOfWord you put “ARDUINO”. Now each jar has a value.

You can change the content of the jars, that would be the value, at any time. As long as it is of the same type. For example, you can replace the double chocolate chip with an oatmeal cookie and “ARDUINO” with “SPACE INVADER”.

To make it clearer, lets write a program using variables. We will write a program that draws two lines again, but this time we will use variables:

int value1 = 0;
int value2 = 100;
line(value1, value1, value2, value2);
line(value1, value2, value2, value1);
  • int variableName = value: Creates a integer variable. An integer is a whole number, so that means that the variable can only hold whole numbers. The variable name can be any name you choose, but make sure to use a name that makes sense. For instance, the variable petName might hold the name of a pet, while the variable petNum might hold the number of pets. value is the value you decide your variable to contain. It must be of the same type as the declaration – in this case int.

The program above will draw one line from coordinate (0,0) to (100,100) and then draw a second line from coordinate (0,100) to (100,0). Since value1 contains 0, wherever in the code we write value1 will be like writing 0 instead.

To change the size of the lines drawn, you only need to change the variable values instead of having to change the values in eight different places inside line(). Try it out yourself and see.

Data types

The most common data types you will use are the following:

  • int: A whole number, e.g., 4, 99 or 532
  • float: A decimal number, e.g. 2.76, 8.211 or 900.3
  • boolean: Can be either true or false
  • char: A character, e.g., ‘r’, ‘2’ or ‘%’.
  • String: A sequence of characters, e.g., “Hello.”, “I luv programming!!!” or “&%!@¤”.

Processing includes some of the system variables to make them more accessible within your programs. One example is width and height. These variables store the width and height of your program window. Here is a very short example:

size(400, 200);
ellipse(width/2, height/2, width, height);
  • size(width, height): Sets the size of the program window in pixels.
  • ellipse(x, y, diameterX, diameterY): draws an ellipse with the center in coordinates x and y. The size is set with diameterX and diameterY. Note that when these two parameters are equal, the result is a circle.
  • width: the width of the program window.
  • height: the height of the program window.

This program starts with setting the size of the window. Then it draws an ellipse in the middle of the program window. Because the diameters are equal to the width and height, the ellipse will always fill the whole window. Change the window size to see what happens.