CS21: Using the Zelle Graphics Library



GraphWin | Point | Line | Rectangle | Circle | Oval | Polygon | Text | Entry | Colors

To use the graphics library, first import it at the top of your program:
	from graphics import *
Here is a short example showing how to create a new graphics window object and then create gui objects to draw into this window:
	 win = GraphWin("Graphics!!!!!!", 500, 500)   # creates new GraphWin object, 500x500 pixels in size
	 win.setBackground("blue")                    # set the background color to blue

	 cp = Point(50,50)          # creates a new Point object at 50,50
	 circ = Circle(cp, 20)      # creates new Circle object centered at point cp 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 circ object to the GraphWin win



REFERENCE INFO BELOW



There is a lot to sort through in the graphics library help documentation. To simplify things a bit, below is some information about the GraphWin object and common Graphics objects you may want to use. Section 5.8 of the Zelle text also contains a more complete reference for the classes in the graphics library.

class GraphWin
--------------

        GraphWin(title, width, height)

        close()
        flush()  # update drawing to graphics window

        getHeight()
        getWidth()

        getMouse() # wait for mouse click and return Point obj representing click location
        getKey()   # wait for key press and return string representing key pressed (e.g., 'q')
        checkMouse() # check if mouse was clicked, return None if it was not clicked,
                     # return a Point() object if it *was* clicked
        checkKey()   # check if key was pressed, return None if no keys were pressed,
                     # return a string if key was pressed (e.g., returns "q" if q was
                     # pressed, "space" if space bar pressed, etc)

        setBackground(color)   # color could be something like "red"

        # Sets the coordinate system of the window so that the lower
        # left corner is at (xll, yll) and the upper right corner is
        # at (xur, yur)
        setCoords(xll, yll, xur, yur)   


  Example:

  mywin = GraphWin("ponies!!", 600, 500)
  mywin.setBackground("lightblue")
  click = mywin.getMouse()   # will pause here until mouse clicked in graph win
  print(click)
  key = mywin.getKey()   # will pause here until key pressed in graph win
  print(key)



class Point
------------

     Point(x, y)

     clone()    # create a new Point object that is an exact copy of this one
     getX()     # the int value of the Point's x-coordinate
     getY()     # the int value of the Point's y-coordinate

     ----------------------- Methods common to all Graphics Object classes:

     draw(graphwin):    # Draw the object in graphwin, which should be a 
                        # GraphWin object.  A GraphicsObject may only be drawn 
                        # into one window. 
     move(dx, dy):      # move object dx units in x and dy units in y direction
     setFill(color):    # Set interior color to color
     setOutline(color): # Set outline color to color
     setWidth(width):   # Set line weight to width
     undraw():          # Undraw the object (i.e. hide it). 


  Example:

  p1 = Point(300, 450)
  p1.draw(mywin)
  x1 = p1.getX()
  x2 = p1.getY()
  p2 = p1.clone()
  p2.move(100,20)
  p2.draw(mywin)




class Line
----------

     Line(p1, p2)   # p1 and p2 are the end Points of the line

     clone()
     setArrow(option)   
     getCenter()    # returns a Point object corresponding to the Line's center
     getP1()        # get one end-point Point object
     getP2()        # get the other Point object

     draw(graphwin)
     move(dx, dy)   # move the Line dx pixels on the x-axis and dy on the y-axis
     setFill(color)
     setOutline(color)
     setWidth(width) 


  Example:

  p1 = Point(0, 250)
  p2 = Point(600, 250)

  longline = Line(p1, p2)
  longline.setWidth(5)
  longline.draw(mywin)



class Rectangle
---------------

     Rectangle( p1, p2)  # p1 and p2 are points for upper left and lower right

     clone()
     getCenter()  # returns a Point object corresponding to the center
     getP1()      # returns the upper left corner Point
     getP2()      # returns the lower right corner Point

     draw(graphwin)
     move(dx, dy)	   # move the Rectangle dx pixels on x-axis, dy on y-axis
     setFill(color)
     setOutline(color)
     setWidth(width)   # set the width, in pixels of the outline
     undraw()


  Example:

  p1 = Point(100, 100)
  p2 = Point(200, 200)

  square = Rectangle(p1, p2)
  square.draw(mywin)



	

class Circle
----------
     Circle(p1, radius)       # p1 is a Point at the center of the circle, radius is an int

     clone()
     getCenter()    # returns the Point object describing the Circle's center
     getRadius()    # returns the int value of the Circle's radius
     getP1()    # returns a clone of the corresponding corner of the
     getP2()	  # circle's bounding box (opposite corners of bounding square)

     draw(graphwin)
     move(dx, dy)   # distance in x and y axis to move the circle
     setFill(color)   
     setOutline(color)
     setWidth(width)  # the width of the circle's outline
     undraw()


  Example:

  center = Point(100, 100)
  radius = 35
  sun = Circle(center, radius)
  sun.setFill("yellow")
  sun.setOutline("yellow")
  sun.draw(mywin)




class Oval
----------
     Oval(p1, p2)    # p1 and p2 are Points of opposite corners of bounding rectangle 

     clone()
     getCenter()
     getP1()
     getP2()

     draw(graphwin)
     move(dx, dy)
     setFill(color)
     setOutline(color)
     setWidth(width)


class Polygon
-------------

     Polygon()

     getPoints()  # return a list of Points in the polygon
     clone()

     draw(graphwin)
     move(dx, dy)
     setFill(color)
     setOutline(color)
     setWidth(width)
     undraw()


  Example (a triangle):

  p1 = Point(10,20)
  p2 = Point(10,60)
  p3 = Point(30,40)
  trilist = [p1,p2,p3]
  tri = Polygon(trilist)
  tri.setOutline("pink")
  tri.setFill("blue")
  tri.draw(mywin)



class Text
----------
     Text(p, text)  # p is center point and text is string
    
     clone()
     getAnchor()         # returns clone of anchor point
     getText()           # get the text of this Text Object
     setText(text)       # change text of given object
     setTextColor(color)
     setFace(family)     # set font face, ex. "arial" "courier"
     setSize(size)       # set font size (5-36 are legal)    
     setStyle(style)     # set font style  ex.  "bold" "italic"

     draw(graphwin)
     move(dx, dy)
     setFill(color)
     setOutline(color)
     setWidth(width)
     undraw()


  Example:

  message = Text(Point(300, 100), "please click anywhere to close window")
  message.setSize(24)
  message.setTextColor("red")
  message.draw(mywin)




class Entry: GUI object into which user can type text
------------

     Entry(pt, width)     # pt is anchor Point (center) width is an int

     getAnchor()          # returns the center Point
     getText()            # returns the current text
     setText(string)      # sets the text to string
     setSize(point)       # sets the found size (5-36 are legal)
     setStyle(style)      # sets the font style
     setTextColor(color)  # sets the text color

     draw(graphwin)
     move(dx, dy)
     setFill(color)
     setOutline(color)
     setWidth(width)
     undraw()

You can see all of the classes in the graphics library and each class' set of methods by running help(graphics) in interactive mode:

$ python
>>> import graphics
>>> help(graphics)

To see the full set of colors available to you:
$ python
>>> from colorPicker import *
>>> colorPicker()
# then click on a color and its name will show up in the python interpreter