CS 100 Spring 2014
Lab 6 |
Functions
|
Using the Processing language/environment answer the questions below.
Consider the following code written in immediate mode.
size(100, 100); noStroke(); smooth(); fill(255); ellipse(50, 50, 60, 60); // White circle fill(0); ellipse(60, 50, 30, 30); // Black circle fill(255); ellipse(66, 45, 6, 6); // Small, white circleBefore running the program
- read carefully
- draw on paper the result of the code and
- roughly write on paper the code structure with functions.
As we have seen in class, you have to define- the entrance function
setup()
and - another function
myDrawing()
, which is called as the last line ofsetup()
.
- the entrance function
Run the program.
1. [1 pt] Consider the following function version of the code above. Before running the program
- read carefully paying attention to
- the function definitions and
- the use of the variable
centerX
- trace the code execution line-by-line, i.e. the control flow among the two functions, making sure it is equivalent to the immediate mode version
Now paste the code in a file eyeFunc.pde
, run it and do the following.
- Define and use a variable
centerY
. UsecenterX
as model. - Run the code to check the program behavior stayed the same.
2. [3 pts] Save your previous program with the following new name eyeFunc2.pde
.
In this program define a new function called eye
that
- returns no value, i.e.
void
precedes the function name, - takes two paramters that are both integer and that are named
cX
andcY
and - has for function body the following lines
fill(255); ellipse(cX, cY, 60, 60); // White circle fill(0); ellipse(cX+10, cY, 30, 30); // Black circle fill(255); ellipse(cX+16, cY-5, 6, 6); // Small, white circle
Modify the function body of myDrawing
- to NOT have the six drawing function calls (
fill/ellipse)
but instead - to use the function
eye
so as to reproduce the same behavior than before.
Once your program creates one eye, add another call to the function body of myDrawing
to produce a pair of eyes. The result should be similar to the following image.
3. [3 pts] Save your previous program with the following new name eyeFunc3.pde
.
Modify it to produce an image similar to the following.
Hints:
- The window is now
100x150
. - The vertical distance between each pair is
30
. - Using a loop in
myDrawing
is appropriate but not required.
4. [3 pts] Modelled on the palette
program you wrote in lab 4, write a program eyePalette
that produces an image similar to the following one.
Hints:
- The window is now
400x350
. - Use a background color that is off-white:
240
as a luminance value for example. - The distance separating each pair of eyes is
120
Bonus
Rewrite a subset of your assignment 2 using functions.
- Work a piece at a time.
- Focus on the part where defining a function is most convenient and elegant.