Assumed Knowledge

Transition to Processing

Learning Outcomes

Be able to create static processing sketches and understand how they came to be.
Have the tools to create sketches based on your own imagination.
Understand the categories into which values might fit and the consequences of these categories.

Drawing Primitives

Chapters 1 and 2 of Learning Processing by Daniel Shiffman. Macquarie University students have access to an electronic copy via the library.

Coordinate System tutorial at processing.org.

More Details

A processing program is made up of expressions and statements. Statements come later, this topic shows us how to build up expressions to get a program.

Processing has a whole pile of built in expressions you can use, most of which cause things to occur on the screen. The full-set of expressions available are documented at the processing reference page but we will list here all the ones you need in this text. In processing, you also have a full suite of mathematical expressions available, plus (+), minus (-), multiply (*), and divide (/).

Warning!: Division might now work the way you expect. We will explain why in a later topic.

Values and Types

So far, we have seen many values:

1 is a value, the number one
-34 is a value, the number -34
3.4 is a value, the number 3.4

This might all seem terribly obvious, but it is about to become very important.

Values are grouped into types. A type is a set of values that all work the same. All the whole numbers work the same, so there is a type for these (int). All the precise numbers work the same, so there is a type for these (float). Here is a list of all the types you need to worry about:

int : whole numbers. Examples are 1,2,-7,0,1023977389.
float: numbers that might have decimal parts. Examples are 1.2,2.45644,-13.0,0.0.
char: single characters that might appear in text. Examples include c, g, ^, $, @, z.

What type is each of the following values?

12
41.0
0
0.0
‘c’
‘f’
‘0’
h

solution

12: int (integer)
41.0 : float (floating point number)
0 : int (integer)
0.0 : float (floating point number)
‘c’ : char (character)
‘f’ : char (character)
‘0’ : char (character)
h : this is an error. the processing compiler will reject values like this

You must be careful to know what type any particular value has because it affects how the program runs. For example, each of the basic operations we know about have particular effects based on the types it is working on.

type	`+`	`-`	`*`	`/`
`int`	normal addition	normal subtraction	normal multiplication	integer division
`float`	normal addition	normal subtraction	normal multiplication	normal division
`char`	something strange	something strange	something strange	something strange

You will notice that mostly things work out as you expect, but you need to be aware of integer division and not doing arithmetic on characters. Don’t ever try and do arithmetic on characters and as for integer division…

But a `float` can be an `int`…

If you see the value 0, how do you know if Processing thinks it is an int or a float? Well, if you see 0, it will think it is an int and if you see 0.0, processing will think it is a float. However, the back-and-forth between these two options gets complex once we get into more complicated code but for now, you need to be aware that it matters what Processing thinks a value is and you can make a pretty good guess at what it thinks.

Processing will also convert between some types if you ask it to. In particular, it will very happily convert an int into a float. You should be able to see why this is always OK. It won’t do the opposite though because not all floats have equivalent integers.

Characters

While we are thinking about it, how does Processing know when I mean the character 0 instead of the number 0? All characters are within inverted commas, so the character 0 will look like '0'. The same holds for all other characters, they look like 'c', 'g', '^', '$', '@', 'z' in Processing code

Write processing code that will draw a blue circle that is 20 pixels wide in the center of the sketch window. You should use pantone 2178 C as your inspiration.

solution

noStroke();
fill(92, 136, 218); // These RGB values give the right shade of blue
circle(width/2, height/2, 20);

Identify the type of each item in the following code.

circle(width/2, height/2, 40);

What is the type of width
What is the type of height
What is the type of 2
What is the type of 40
What is the type of width/2
What is the type of height/2
circle expects floats according to the processing reference. How can you resolve this with your answers above.

solution

int because it is set from size which only accepts ints
int because it is set from size which only accepts ints
int because if you don’t say otherwise, processing treats numbers as integers
int because if you don’t say otherwise, processing treats numbers as
int because dividing an int by another int will give you a third int
int because dividing an int by another int will give you a third int
It is always OK to give an int where a float should go, processing will automatically convert it for you.

Furthering your Understanding

Drawing Primitives

More Details

Values and Types

But a float can be an int…

Characters

Furthering your Understanding

But a `float` can be an `int`…