In Class: Week 5

Run update21 to download this week's files and move to our class directory: 

    $ update21 
    $ cd cs21/inclass/w05-graphics
    $ pwd
      /home/your_user_name/cs21/inclass/w05-graphics
    $ ls
      bullseye.py  circleshift.py  test_graphics.py

Topics

The graphics library

To use the graphics library, first import it at the top of your program: 
  from graphics import *
Next create a new graphics window object, and then create gui objects to draw into this window: 
   win = GraphWin("My GUI Program", 500, 500)   # creates new GraphWin object, 500x500 pixels in size

   circ = Circle(Point(50,50), 20)    # creates a new Circle object centered at 50,50 with a radius of 20 pixels
   circ.setFill("red")                # invoke the setFill method of the Circle object referred to by circ        
   circ.draw(win)                     # draw the Circle object refered to by circ in GraphWin win

Some more notes on using the Graphics library are available here

We are going to do some of the following together in class:
  1. open test_graphics.py in vim. It contains some example code that draws different type objects to one of two graph windows. Let's try changing some things.

  2. open bullseye.py. Together we are going to write a program that draws a bullseye to the graphics window. It should consist of 4 concentric circles, of two or more colors, that are drawn centered in the graphics window.

  3. It seems like we were very repetitive in creating the circles, how can simplify the process by using a for-loop to create a fixed-sized dart board with circles whose radius depends on the total number of circles we wish to draw?

  4. Let's try an advanced example. We want to create the following image:



    In pairs, come up with the steps (using pseudocode on pen/paper) to describe a solution that will create this image. What are the major elements of the picture? How would you create each?

  5. Open circleshift.py. Try running it in python. Together we will change this program so that after first drawing the initial circle, each time the user clicks on a new spot, the circle is shifted to the new location. The shifting will happen four times, and on the fifth mouse click the program will exit.

  6. We will write a program that uses lists and functions with objects. In biggest_circle.py, we will examine a function that creates and returns several circles. After you get an understanding of this given function, complete the function findBiggest to return the largest circle created. What parameters are needed and how is your answer returned? Test this out by coloring the largest circle red in the main function. If you have time, try writing a function to randomly generate a color to use

  7. open duplicate.py. We are going to try to use an existing Circle object as a starting point for creating a similar second Circle object. The attempt at doing this doesn't work. Let's think about why not and how to fix it.

  8. open animate.py. Let's look at this program together. Once we figure out what it is doing, lets change the code so that the animation will be repeated 3 times, each end point will be determined by the user's mouse click. If we want to repeat the same action multiple times, what language construct do we use? ...

  9. If we have time, we will examine a program lights.py that combines a lot of advanced feaetures into one large program.