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 circle

Before 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
  1. the entrance function setup() and
  2. another function myDrawing(), which is called as the last line of setup().

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
  and
• 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. Use centerX 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 and cY 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.