Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
72
The fill(interval) lines are calls to Processing’s built-in fill() function. The calls pass
an argument to the function that controls the fill color of the shapes. In this case, I’m
working with grayscale values between 0 and 255. The ellipse(x, y, w, h) function call
has four arguments for the x and y position and width and height of the ellipse. You’ll also
notice that the arguments I pass to the ellipse functions are both other variables and
expressions that include variables. Try running the program, if you haven’t already done
so, and changing some of the values and/or expressions to see what happens. See also if
you can increase the number of steps in the gradient, making it a little smoother. When we
get to loops, I’ll recode this for you, and you’ll really see the power of code for doing
repetitive tasks or iteration.
Operators
Some of you may remember the word operator from math class. Operators are the
symbols you use when you write mathematical expressions. Technically speaking, operators
perform a function on operands. In the expression x + 3, x and 3 are the operands and
+ is the operator. In terms of coding, you’ll primarily use the same four operators you
learned about in grade school: +, –, *, and /. Just using these operators, you’re able to
perform almost all the math you need to create amazing visuals. Processing and Java
have additional operators besides these four, some of which I’ll go over as well. Beginning
to use operators is pretty simple. Coding can get complex, however, when you’re figuring
out the right combinations of operators needed in forming more complex expressions.
You’ve already seen a bunch of operators in action in the last section on variables.
For example, in the function call ellipse(xpos, ypos, gradientWidth-interval*4,
gradientHeight-interval*4), the third and fourth arguments passed to the ellipse
function, gradientWidth-interval*4 and gradientHeight-interval*4, each used two
operators (– and *). Because operators return a value, you are able to use them as arguments,
as shown previously.
Here are some assignment operations utilizing the four basic operators. I’ll also go over
some basic rules that control the order in which operators do their thing, which is referred
to as operator precedence.
int x = 4+3-6;
float y = 14*3/5-2.34;
float z = 14*3/(5-2.34);
The order of calculation is as follows:
Parentheses
Multiplication and division
Addition and subtraction
When operators have the same precedence level, the expression is evaluated from left to
right.