Graphics
========
.. automodule:: graphics
Download the :download:`graphics.py<../src/graphics.py>` file to use
the module.
Drawing Functions
-----------------
.. autofunction:: graphics.draw_oval
.. autofunction:: graphics.draw_rectangle
.. autofunction:: graphics.draw_line
.. autofunction:: graphics.draw_image
.. autofunction:: graphics.draw_sprite
.. autofunction:: graphics.image_size
.. autofunction:: graphics.image_width
.. autofunction:: graphics.image_height
.. autofunction:: graphics.draw_text
.. autofunction:: graphics.text_size
.. autofunction:: graphics.clear
.. autofunction:: graphics.wait
.. autofunction:: graphics.mainloop
Window Functions
----------------
.. autofunction:: graphics.window_size
.. autofunction:: graphics.window_width
.. autofunction:: graphics.window_height
.. autofunction:: graphics.window_title
.. autofunction:: graphics.window_background_color
.. autofunction:: graphics.window_open
Keyboard Functions
------------------
.. autofunction:: graphics.key_down
.. autofunction:: graphics.key_up
.. autofunction:: graphics.key_pressed
.. autofunction:: graphics.key_released
.. autofunction:: graphics.wait_for_key_press
.. autofunction:: graphics.wait_for_key_release
.. autofunction:: graphics.wait_for_text
Mouse Functions
---------------
.. autofunction:: graphics.button_down
.. autofunction:: graphics.button_up
.. autofunction:: graphics.button_pressed
.. autofunction:: graphics.button_released
.. autofunction:: graphics.wait_for_button_press
.. autofunction:: graphics.wait_for_button_release
.. autofunction:: graphics.mouse_x
.. autofunction:: graphics.mouse_y
.. autofunction:: graphics.mouse_moved
.. _coordinate-system-label:
Coordinate System
-----------------
The point (0, 0) is the upper left of the window. Positive x is to
the right and positive y is down. For example::
>>> import graphics
>>> window_width = 160
>>> window_height = 120
>>> graphics.window_size(window_width, window_height)
>>> graphics.window_background_color('gray')
>>> graphics.draw_image('red_circle.gif', 0, 0)
>>> graphics.draw_image('green_circle.gif', window_width, 0)
>>> graphics.draw_image('blue_circle.gif', 0, window_height)
>>> graphics.mainloop()
Would produce the following drawing.
.. figure:: coords.png
The red circle is at (0, 0), the green circle is at (160, 0), and
the blue circle is at (0, 120).
.. _colors-label:
Colors
------
Colors can be specified with a TKinter color String, a single integer,
a single float, a tuple of integer RGB (Red Green Blue) values, or a
tuple of floating-point RGB values.
TKinter Color Strings
^^^^^^^^^^^^^^^^^^^^^
The following are valid TKinter Color Strings:
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| Color Strings | | | | | | | |
+========================+========================+========================+========================+========================+========================+========================+========================+
| snow | mint cream | cornflower blue | light blue | sea green | pale goldenrod | light salmon | medium violet red |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| ghost white | azure | dark slate blue | powder blue | medium sea green | light goldenrod yellow | orange | violet red |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| white smoke | alice blue | slate blue | pale turquoise | light sea green | light yellow | dark orange | medium orchid |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| gainsboro | lavender | medium slate blue | dark turquoise | pale green | yellow | coral | dark orchid |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| floral white | lavender blush | light slate blue | medium turquoise | spring green | gold | light coral | dark violet |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| old lace | misty rose | medium blue | turquoise | lawn green | light goldenrod | tomato | blue violet |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| linen | dark slate gray | royal blue | cyan | medium spring green | goldenrod | orange red | purple |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| antique white | dim gray | blue | light cyan | green yellow | dark goldenrod | red | medium purple |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| papaya whip | slate gray | dodger blue | cadet blue | lime green | rosy brown | hot pink | thistle |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| blanched almond | light slate gray | deep sky blue | medium aquamarine | yellow green | indian red | deep pink | |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| bisque | gray | sky blue | aquamarine | forest green | saddle brown | pink | |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| peach puff | light grey | light sky blue | dark green | olive drab | sandy brown | light pink | |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| navajo white | midnight blue | steel blue | dark olive green | dark khaki | dark salmon | pale violet red | |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
| lemon chiffon | navy | light steel blue | dark sea green | khaki | salmon | maroon | |
+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+------------------------+
RGB Color
^^^^^^^^^
Three numbers can be used to represent the RGB (Red Green Blue) values
of a color with a tuple. If all three colors are represented with
integers, they must be in the range [0, 255]. If all three colors are
represented with floating-point numbers, they must be in the range
[0.0, 1.0).
Numeric Color
^^^^^^^^^^^^^^^^^^^^
A single number can be used to represent RGB values of a color. If
the number is an integer, it must be 24-bits, [0, 16777215]. The
leftmost 8 bits of the integer are the red value of the color, the
middle 8 bits of the integer are the green value of the color, and the
rightmost 8 bits of the integer are the blue value of the color. If
the number is a floating-point number, it must be in the range [0.0,
1.0). The floating-point number is scaled to the range [0.0,
16777216.0) and converted to an integer that represents a color as
described above.
.. _key-symbols-label:
TKinter Key Symbols
-------------------
The following are valid TKinter key symbols:
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| Key Symbols | | | | | | | | | | |
+==============+==============+==============+==============+==============+==============+==============+==============+==============+==============+==============+
| space | slash | greater | M | backslash | k | z | Kanji | Execute | F6 | Super_L |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| exclam | 0 | question | N | bracketright | l | braceleft | Home | Insert | F7 | Super_R |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| quotedbl | 1 | at | O | asciicircum | m | bar | Left | Undo | F8 | Hyper_L |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| numbersign | 2 | A | P | underscore | n | braceright | Up | Redo | F9 | Hyper_R |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| dollar | 3 | B | Q | quoteleft | o | asciitilde | Right | Menu | F10 | Delete |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| percent | 4 | C | R | a | p | BackSpace | Down | Find | Shift_L | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| ampersand | 5 | D | S | b | q | Tab | Prior | Cancel | Shift_R | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| quoteright | 6 | E | T | c | r | Linefeed | Next | Help | Control_L | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| parenleft | 7 | F | U | d | s | Clear | End | Break | Control_R | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| parenright | 8 | G | V | e | t | Return | Begin | Num_Lock | Caps_Lock | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| asterisk | 9 | H | W | f | u | Pause | Win_L | F1 | Shift_Lock | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| plus | colon | I | X | g | v | Scroll_Lock | Win_R | F2 | Meta_L | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| comma | semicolon | J | Y | h | w | Sys_Req | App | F3 | Meta_R | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| minus | less | K | Z | i | x | Escape | Select | F4 | Alt_L | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
| period | equal | L | bracketleft | j | y | Multi_key | Print | F5 | Alt_R | |
+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+--------------+
From http://www.tcl.tk/man/tcl8.4/TkCmd/keysyms.htm
.. _button-numbers-label:
TKinter Button Numbers
----------------------
The following are valid TKinter button numbers:
+---------------+-----------------------+
| Button Number | Mouse Button |
+===============+=======================+
|1 | Left Mouse Button |
+---------------+-----------------------+
|2 | Middle Mouse Button |
+---------------+-----------------------+
|3 | Right Mouse Button |
+---------------+-----------------------+
|4 | Up Mouse Scroll Wheel |
+---------------+-----------------------+
|5 | Up Mouse Scroll Wheel |
+---------------+-----------------------+
.. _examples-label:
Examples
--------
Here is an example of drawing using the Graphics module::
import graphics
# Initialize the window
window_width = 640
window_height = 480
window_background_color = 'white'
window_title = 'Testing...'
graphics.window_size(window_width, window_height)
graphics.window_background_color(window_background_color)
graphics.window_title(window_title)
# Draw a rectangle to it
rect_x = 200
rect_y = 100
rect_width = 200
rect_height = 100
graphics.draw_rectangle(rect_x, rect_y, rect_width, rect_height, fill="black")
# Draw an image on top of the rectangle
circle_image_name = 'red_circle.gif'
circle_x = 200
circle_y = 100
graphics.draw_image(circle_image_name, circle_x, circle_y)
# Draw some text on top of the circle
text = 'Testing'
text_x = circle_x
text_y = circle_y
text_color = 'black'
text_size = 12
graphics.draw_text(text, circle_x, circle_y, text_color, text_size)
# Keep the window from closing after drawing
graphics.mainloop()
Here is an example of animating using the Graphics module::
import graphics
# Initialize the window
window_width = 640
window_height = 480
window_background_color = 'white'
window_title = 'Testing...'
graphics.window_size(window_width, window_height)
graphics.window_background_color(window_background_color)
graphics.window_title(window_title)
# Initialize a circle
circle_image_name = 'red_circle.gif'
circle_x = 200
circle_y = 100
number_of_frames = 100
# Animate the circle for a fixed number of frames
for frame in range(number_of_frames):
# Erase any previous drawing
graphics.clear()
# Change the location of the circle
circle_x += 1
# Draw the circle at the new location
graphics.draw_image(circle_image_name, circle_x, circle_y)
# Wait 1/30 to slow the animation to 30 frames per second
graphics.wait(0.033)
# Keep the window from closing after animating
graphics.mainloop()
Here is an example of user interaction using the Graphics module::
import graphics
# Initialize the window
window_width = 640
window_height = 480
window_background_color = 'white'
window_title = 'Testing...'
graphics.window_size(window_width, window_height)
graphics.window_background_color(window_background_color)
graphics.window_title(window_title)
# Initialize a circle
circle_image_name = 'red_circle.gif'
circle_x = 200
circle_y = 100
# Animate the circle until the window closes
while graphics.window_open():
# Erase any previous drawing
graphics.clear()
# Change the location of the circle based on what key the user is pressing
if graphics.key_down('Right'):
circle_x += 1
if graphics.key_down('Left'):
circle_x -= 1
# Draw the circle at the new location
graphics.draw_image(circle_image_name, circle_x, circle_y)
# Wait 1/30 to slow the animation to 30 frames per second
graphics.wait(0.033)
# Keep the window from closing after animating
graphics.mainloop()