CS21 Lab 6: Graphics

Due Saturday, March 10, before midnight

Make sure all programs are saved to your cs21/labs/06 directory. Files outside this directory will not be graded.

$ update21
$ cd ~/cs21/labs/06/

Programming Tips

• Write your programs incrementally (a little bit at a time) and test them as you go.
• Use meaningful variable and function names.
• Each function should have a comment that includes:
  • a description of what the function does
  • a description of the input parameter value(s)
  • a description of the return value
• To avoid hard-coding, define variables like width and height for the width and height of the GraphWin object. Then specify positions and lengths as fractions of the width or height. To test this, change width and height and make sure everything scales nicely.
• Don't assume that if your program passes the sample tests we provide that it is completely correct. Come up with your own test cases and verify that the program is producing the right output on them.
• Refer to this guide for information on the Zelle graphics library. Remember that as you increase y you go down, not up, the graphics window.

Topics for this assignment

• Objects, methods, graphics, and animation

1. Animated Scene

Write a program, scene.py, that draws a scene and includes some animation. You can mimic the beach scene shown below or imagine a scene of your own invention.

Requirements

Your scene should include:

• At least three different kinds of shape objects out of Circle, Rectangle, Polygon, Line, and Oval.
• At least three different colors.
• Some user interaction component, like the user clicking to determine the location of a shape. The user's role should be explained with instructions contained in a Text object.
• An animation.
• Break the program down into separate tasks and define a new function for each task. Define at least three functions besides main().

Example

There are many different ways to satisfy the requirements. This video shows one of the many possible solutions.

Notice how the user's mouse clicks determine where elements of the beach scene are positioned. In some cases (positioning the horizon and the sand) we only use the y-coordinate of the point that was clicked. We used the setText() method for Text objects to update the instructions. To animate the sunset, we repeatedly performed the following steps:

1. Moved the sun a small distance with the move() method.
2. Paused the program for a fraction of a second with the sleep(seconds) function. Import the time library to get access to this function.

2. Connect the Dots

Write a program, connect.py, that lets its users draw a polygon in a graphics window.

Polygon objects in the Zelle graphics library are created from a list of Point objects. Each time the user clicks above the gray bar, the corresponding point should be drawn to the window and added to the list of points that will ultimately be used to create the polygon. When the user clicks on the gray bar, the polygon should be drawn to the window and filled with a randomly-generated color.

Define (and use) a separate function that generates a random color. This function should itself make use of the color_rgb function. You are encouraged, but not required, to write additional functions as you see fit.

Note that if the sides of the polygon cross, a portion of the background will show through, as in the second example from the video. There is still only one Polygon object in the program.

3. Submit

Once you are satisfied with your scene.py and connect.py programs, fill out the questionnaire in QUESTIONS-06.txt. Then run handin21 a final time to make sure we have access to the most recent versions of your files.