CS5nm, Fall 2008

ex06: drawing simple figures with PyGame

Goals for this lab

Get the simple "drawHouseWithFunctions.py" program to work (i.e. to draw a house on the screen)

Call that function several times to make a whole "neighborhood"

Understand how to add something simple to the house (e.g. a door or window)

This exercise is preparation for a future exercise, in which you will make your own drawing function.

Step by Step Instructions

Step 0: Getting Started

Step 0a: Open IDLE to the usual starting point

See lab01, step 3, and ex05 step 0 for instructions on bringing up IDLE to the "usual starting point" (Python Shell on the left, window for code on the right).

Step 0b: Create a CS5NM/ex06 folder

Find your CS5NM folder—on your Desktop, or in your Documents folder, or on your N:\ drive—wherever you created it. If you didn't create one yet, now would be a good time to do so. It is a good habit to have "one place" where you store all your work for this class (at least one place on each computer where you do your work).

Create a folder inside your CS5NM folder called ex06. We'll store all your files for this exercise in that folder. That will make things a lot easier.

Whether you call your folder CS5NM or cs5nm doesn't matter that much in this case, as long as you are consistent and remember which way you named it.

Step 1: Loading the "drawHousesWithFunctions.py" program

Load the Python program below into your code window, save it to a file called ex06ChrisHatworthy.py inside your CS5NM/ex06 folder—except don't use ChrisHatworthy, use your name, e.g.

If PyGame is not installed on your computer

If you are working on your own computer, you have two options:

Option 1: Install (or Reinstall) the PyGame software. See the instructions on GauchoSpace under the heading "Software Used In This Course"). If you are still having trouble after doing that, and you have a laptop, bring your laptop to office hours. Or, pursue option 2:

Option 2: Do this assignment in the Mesa Lab (or Rincon, Leadbetter or Gaviota). See the IC Lab Calendar for available times.

If you are working in the Mesa lab run by Instructional Computing (or Rincon, Leadbetter or Gaviota), then the software should be installed there properly. Be sure that you followed the instructions precisely, and make sure the error message is not something different from the one shown above. If you are still having trouble, then contact your instructor for help.

Step 2: Add a few houses

In this step, we'll modify the code so that instead of just three houses, there are five houses.

Note that this gives credit both to the original author (in this case, P. Conrad) and to yourself. The finished product will be a combination of the efforts of both P. Conrad, and you.

Note: From now on, you should always do that in this course whenever you make changes to a file and submit it. This is an important part of documenting your program, and is one of the things you'll be graded on, so try to remember this. (For a while, I'll remind you, but after a few exercises, I'll expect you to have learned to do this without a reminder.)

Step 2b: Add some functions calls to make a whole neighborhood.

In lecture, and in your readings in the textbook, we've been talking about the difference between a function call, and a function definition.

So, by now, you should be able to locate the function calls to drawHouse(). You'll see that there are three of them.

Change the file so that there are at least five houses in all (more if you like.) Some rules (you'll be graded on these):

You can change the existing function calls, or just add two more.

Choose numbers for the x,y coordinates (the lower left hand corner of the house), the height and width, and the color, so that the neighborhood looks interesting.

At least one of the houses should be a different size (height and width) from the other ones, and none of them should "overlap" each other.

Use at least one color that isn't defined yet. To do that, you'll need need to add new variables and assignments statements for those colors, next to where red, green, white and blue are defined. Remember the colors are a 3-tuple of (red, green, blue), where each of those numbers is an integer between 0 and 255.

When you have a nice looking neighborhood of at least five houses, you can go on to step 3

Step 3: Adding a window to the houses

In this step, we want to make a change. We will add a window to each of the houses, so each one, looks like this:

We'll make the following assumptions:

The left edge of the window is at the point halfway between the left edge of the house (x), and the right edge of the house (x + width). That is, the left edge of the window is at the x coordinate (x + 0.5 * width)

The right edge of the window is at (x + 0.9 * width)

The top of the window is at (y + 0.4 * height)

The bottom of the window is at (y + 0.2 * height)

The line going through the window horizontally slices through at 0.7 * width

The line going through the window vertically slides through at 0.3 * height

We'll set up a set of assignments statements to help us make the points easier. We add these at the end of the function defintion for drawHouse. Note that they MUST be indented at the same level as the other statements in the body of the drawHouse function to be considered part of that function definition.

Now we add some more Python statements to do the drawing. In each case, we have first an assignment statment that sets up a list of points. Then we have a function call to pygame.draw.lines()that draws some lines. I've left some "blanks" (_____) in the last pair of statements, that you need to fill in yourself. If you cut and paste in this code, be sure to take out all the underscores (the ____ characters) after you fill in the correct answers!

# third parameter to pygame.draw.lines is True, meaning here that
# means we connect the last point back to the first
winOutsidePoints = [ (winLeft, winBot), (winRight, winBot), (winRight, winTop), (winLeft, winTop)]
pygame.draw.lines(screen, color, True, winOutsidePoints, lineThickness

# False here for third parameter means DON'T connect last point back to first

The window was added correctly and appears in all five houses (10 pts)

The door was added correctly, and appears in all five houses (30 pts)

Due Date: 10/22/2008 (5pm)

Ex06 is due Wednesday 10/22 at 5pm. You should try to complete as much of this as you can before your next lab, so that if you have questions or problems, you can ask about them during lab. You can also get help during office hours. See the course website, http://www.cs.ucsb.edu/~pconrad/cs5nm for information on scheduled office hours.