Lecture notes for Computer Science I by James Tam Return to the course web page

CPSC 231: Assignment 3

New Concepts to be applied for the assignment

Introduction

You will learn how to use the QuickDraw library for this assignment. This library is a collection of Java classes that allows you quickly and easily add graphics, simple animations or even sound to your Python programs. It doesn't require any direct knowledge of Object-Oriented programming or programming using the Java language (although you will need to know how to run pre-created Java programs). To use the library you need to redirect the output of your program (i.e., the print statements) using the piping operator "|" so it becomes the input of the QuickDraw library. This means that the output that will normally appear onscreen will instead be passed as part of various commands to QuickDraw. This can be done at the command line when you run the Python translator. For example suppose you have a program called "a3.py". Normally to translate and run this program you would type "python a3.py". When piping you would instead type: "python a3.py | java -jar quickdraw.zip". Piping is not unique to UNIX nor is it used only when you're creating programs, most any program run through the command line can be piped into another program e.g. (UNIX): ls | more       e.g.(Windows): dir | more.

If you are running your program while logged onto one of the computers in the lab (you won't be able to run QuickDraw with a text-only connection like SSH) you don't need much to get set up. Just download the QuickDraw library (under this [link] and find the download link for the QuickDraw jar (zip compressed) file). The easiest approach is to save in the same directory where you are creating your Python programs e.g., if you have directory called "a3" then save the QuickDraw library to the A3 directory. After that you simply have to run your program and be sure to redirect the output towards the QuickDraw library. Working at home is a bit trickier and isn't recommended for assignments that employ QuickDraw. You would first have to install the Python interpreter (v2.5) on your computer (and set the "path") so that your operating system can find it. Then you would have to install the Java interpreter [link].

Because this isn't your first programming assignment it will also require you to do a little bit of problem solving in order to come up with parts of the solution as well as some program design: determining how to divide your program up into parts with each part eventually being implemented as a function.

Part I: Creating a string of blinking colored lights

You are to write a program that will draw [3 circles] each with a diameter of 50 pixels. The first circle will be 100 pixels below and to the right of the top left corner of the window. The second circle will be 100 pixels below and to the right of the first one and the third circle will 100 pixels below and to the right of the second circle. At first the circles will appear in 'unlit' form outlined in white but not filled. After a short delay of a few seconds the first circle will 'light up' in red. A few seconds after that the second circle will light up blue and finally a few seconds after that the third circle will light up green. Another few seconds should pass and all three circles simultaneously appear back in outline form after which the cycle of lighting up and going dim should continue until either the QuickDraw window is closed or the program is interrupted and shut down.

An example of how your program should look: [Movie]

 

Part II: Making a simple animations

This program will animate a graphic: either a 50x50 rectangle, or in the full version a very small image of comparable size which will be loaded into your program (if you don't have anything handy here is a [sample image] that you can use in your assignment). There are different versions of the assignment but in all the completed versions the graphic will start in the very top left hand corner of the window and gradually make it's way to the bottom left corner. Because of the speed at which modern computers can draw such simple graphics a time delay must be implemented in your program so that the animation of the moving graphic can be detected by the viewer.

Animations showing how the different versions of the program should look:

  1. Left to right, up to down motion with the animation traversing most of the window: [Movie]
  2. Left to right, up to down motion but with the graphic moving downwards at a rate equal to the size of the small graphic: [Movie]
  3. The graphic moves along the columns instead of along the rows (top to bottom and then left to right): [Movie]
  4. The graphic moves in a 'zigzag' fashion along the rows (ala the old Space Invaders [example version] video game: [Movie]

Both parts of your assignment (and any corresponding versions) must not only be implemented using functions but those functions should be implemented according to the principles of good design (as described in lecture each function should have a well defined task and not implement multiple tasks). Although most of your grade will be determined by getting a working program there will still be a good portion of your mark that will be determined by how well you decompose your solution into parts. In addition the other design principles that you learned from previous sections should also be applied in the creation of your solutions (e.g., good naming convention, the appropriate use of named constants). To help you get started in the design of your assignment some of the actions that your program will likely be implementing could be:

Part I: initialization of variables, lighting up and dimming the circles.

Part II: initialization of variables and the animating of the graphic in the different ways that are required by the assignment.

Finally you need to submit a README text file with your assignment that lists out in point form: the features/versions of each part of the assignment that you have completed, a list of the data files required by your program to work, any special instructions or limitations that your marker needs to be aware of in order to run your program properly.

Although Submitting your work:

  1. Assignments (source code/'dot-py' files containing your Python program, data files such as images and your README) must be electronically submitted according to [the assignment submission requirements].
  2. As a reminder, you are not allowed to work in groups for this class. Copying the work of another student will be regarded as academic misconduct (cheating).  For additional details about what is and is not okay for this class please refer to the following [link].
  3. Before you submit your assignment to help make sure that you haven't missed anything here is a [checklist] of items to be used in marking.

References for the material used in the design of this assignment

  1. My examples and lecture notes for QuickDraw: [Acrobat file]
  2. Online documentation for QuickDraw: http://pages.cpsc.ucalgary.ca/QuickDraw/