Transcript Lecture 10

Programming for
Artists
ART 315
Dr. J. R. Parker
Art/Digital Media Lab
Lec 10 Fall 2010
Processing
We now know a bit about Processing –
variables, animation, random numbers,
and so on.
Programming is about a lot of details, not
all of which have easy to show examples
immediately.
There are principles (generalization)
involved that are important to
appreciate.
Types
Variables have types.
The type dictates what kind of data
can be stored in the variable.
The type is specified in the variable’s
declaration.
Types
boolean
char
byte
short
int
long
float
double
ccc
true or false
character (letter, digit. ‘;’)
small number, -128 to 127
somewhat larger number, -32768 to 32767
a big number
a really big number
a decimal number (3.1415926)
a decimal number with more digits
Declarations
int i; // the variable named I holds an integer
int i,j,k;
boolean more = true;
float size, x, y; // Three real numbers.
i = 4;
x = 3.1;
y = 2*x – i*i;
int count = 0;
System Variables
Declared by the system and you can
use them. Hold useful values.
width - width of the sketch window.
height - height of the window.
frameCount – Number of frames drawn
framerate – frames per second
key
- most recent key pressed
keyPressed – is a key pressed
mousePressed – is the mouse pressed?
mouseButton – Which button is pressed?
Random
random (10) a random number between 0
and 9
random (1,10) a random number between
1 and 10, not including 10.
(int) random(1, 7)
an integer between 1 and 6 (a die roll)
(int) random (1, 53) – deal a card
Here is an animation of a
die roll
A histogram of rolls:
void draw ()
{
r = random (1, 7);
i = (int)r;
…
Collect frequency of
rolls, plot them.
Random
Random numbers are used to simulate intelligence.
Recall from GameMaker.
Reality is messy. Randomness gives a sense of the real
to things.
EG hand-drawn lines are never straight. Randomness
can simulate the nature of real drawn lines.
Does not have to be right, just look right.
The Mouse
We have already used the system variables mouseX
and mouseY.
Remember that in Gamemaker the mouse clicks were
events. The same is true here.
In Gamemaker we coded an event handler that
executed when the event occurred. Same here.
The event handler is another function like draw and
setup.
The Mouse
void setup ()
{
size (200,200);
background(255);
}
void draw ()
{}
void mousePressed ()
{
stroke (0);
fill(174);
rectMode (CENTER);
rect
(mouseX,mouseY,12,12);
}
The Mouse
Changing this to ‘keyPressed’
Does the obvious thing!
void mousePressed ()
{
stroke (0);
fill(174);
rectMode (CENTER);
rect
(mouseX,mouseY,12,12);
}
Mouse Colours
Set background color depending on the mouse
position.
Horizontal is RED, vertical is GREEN.
Height and width will be 256 (full 8 bit color)
Easy – set background to (mouseX, mouseY, 128);
Mouse Colours
Conditionals
Processing has an IF construct too.
Let’s do a program where we draw a traffic light
that changes like the real ones do.
It will count frames (steps) and change color
when a reasonable number are reached.
Conditionals
Conditionals
int c = 0, k=0;
C is color red=0, yellow=1,
green=2.
K is a count of frames/steps.
It’s a timer. Add 1 each
time DRAW is called.
void setup ()
{
size (200,200);
background(255);
}
void draw ()
{
fill (200, 200, 200); //Grey
rect (30, 30, 40, 70); Surround
ellipseMode (CENTER);
Now draw lights: red on top, then
yellow, then green.
Fill with RED if color c=red (0)
if (c==0) fill (255,0,0);
ellipse (50, 40, 10, 10);
Conditionals
Now fill with yellow if c=1,
draw the circle.
if (c==1) fill (255,255,0);
else fill (200, 200, 200);
ellipse (50, 60, 10, 10);
Finally, fill with green and
draw the green light.
if (c==2) fill (0,255, 0);
else fill (200, 200, 200);
ellipse (50, 80, 10, 10);
K is the timer –
increase.
k += 1;
If timer is large
enough, change the
color.
if (k > 200)
{
c += 1;
if (c>2) c = 0;
k = 0;
}
}
Final program
int c = 0, k=0;
void setup ()
{
size (200,200);
background(255);
}
void draw ()
{
fill (200, 200, 200);
rect (30, 30, 40, 70);
ellipseMode (CENTER);
if (c==0) fill (255,0,0);
ellipse (50, 40, 10, 10);
if (c==1) fill (255,255,0);
else fill (200, 200, 200);
ellipse (50, 60, 10, 10);
if (c==2) fill (0,255, 0);
else fill (200, 200, 200);
ellipse (50, 80, 10, 10);
k += 1;
if (k > 200)
{
c += 1;
if (c>2) c = 0;
k = 0;
}}
Println
(print line)
A way to print things (text,
numbers) to the message
window.
println (“Hi there”);
Prints the message ‘Hi
there’ in the message
window.
Println
The value in a variable can
be printed.
int x=0;
println (x);
x = x + 1;
Prints the value of the
variable x in the message
window.
Println
The value in a variable can
be printed along with a
message.
int x=0;
println (“The value of X
is “ + x);
x = x + 1;
Prints the message in the
message window.
Println
The symbol ‘+’ here means something different from
the usual meaning ‘add’.
Println is a function and its parameter is a
character string. Technically, the ‘+’ here means
‘concatenate’, or add to the end of a string.
println (“The value of X is “ + x);
Takes the integer variable x, turns it into a string, and adds it
to the end of the first string to yield a single string that
can be printed.
Println
There can be more than two things:
println (“The sum of “ + x “ and “ + y + “ is “ + (x+y));
This works OK, but needs the () around (x+y).
Otherwise it will convert x and y into strings and
concatenate them!
The ( ) allows us to specify the order in which we
want the operations to be done. Precedence!
Precedence
You likely have not thought about it, but there is an
implicit order to the evaluation of operators in
expressions. Computers love rules.
12 + 36/2 is 30
3 + 4 + 5 * 2 is 17
-3+5 = 2
(12 + (36/2) = 12 + 18 = 30)
(3 + 4 + (5*2) = 7+10 = 17)
( (-3) + 5 = 2)
Parentheses are used when we wish to disrupt the
natural order:
(12+36)/2 does the addition first: 48/2 = 24
Precedence
You likely have not thought about it, but there is an
implicit order to the evaluation of operators in
expressions. Computers love rules.
12 + 36/2 is 30
3 + 4 + 5 * 2 is 17
-3+5 = 2
(12 + (36/2) = 12 + 18 = 30)
(3 + 4 + (5*2) = 7+10 = 17)
( (-3) + 5 = 2)
Parentheses are used when we wish to disrupt the
natural order:
(12+36)/2 does the addition first: 48/2 = 24
Types
Types can be converted. A real number can be
converted into an integer, but there are a few
ways that can work out. Computers love rules.
(int)1.2
is 1
(int)1.6
is 1
(int)(1.2 + 0.5) is 1
(int) 1.6+0.5 is 2
(int)-1.2
is -1
(int)(-1.2-0.5) is -1
(int)(-1.2+0.5) is 0
Types
Floats are not precise. 0.5 is exact, because it is a
power of 2 and has an exact representation is
binary.
0.1 is an infinitely repeating decimal fraction in
binary (like 1/3 is in decimal); Adding/subtracting
0.1 repeatedly compounds the error.
What does this print??
z = y+y+y+y+y+y+y+y+y+y;
println ("z = " + (z) );
Types
z = 1.0000001
So the rule is: NEVER compare a float variable for
equality against another float. (Unless it does not
matter)
OK:
if (x >= 1.0) …
Not OK:
if (x == 1.0) …
Types
Integers have a max value. If they exceed that,
they become negative. You may not be warned.
short k;
…
k = 32766; println ("k
= " + k);
k = k + 1; println ("k = " + k);
k = k + 1; println ("k = " + k);
What does this print?
Types
k = 32766
k = 32767
k = -32768
Why? (do you really want to know??)
Has to do with how negative numbers are
represented in binary.