Developer

Tkinter canvas: freeform GUIs in Python

The Tkinter framework provides some standard GUI widgets for use in building Graphical User Interfaces in Python. If you need more freedom you can use the Canvas widget included in Tkinter, which gives you an area where you can draw custom shapes.

The Tkinter framework provides some standard GUI widgets for use in building Graphical User Interfaces in Python. If you need more freedom you can use the Canvas widget included in Tkinter, which gives you an area where you can draw custom shapes.

If you're unfamiliar with the basics of using Tk in Python, brush up by taking a quick read of a previous Quickstart to building GUI based applications in Python.

We'll start with a basic Tk application. This will create a window containing a Canvas widget 300 pixels by 300. Note: you can type all the commands in this article into your interpreter, and the GUI window will be updated as you go.

from Tkinter import *

root = Tk()
canvas = Canvas(root, width=300, height=300)
canvas.pack(fill=BOTH)

The resulting application doesn't look like much, you should have a square, grey window. More interesting is to draw shapes to the canvas — the follow code, using the create_rectangle method of the canvas, draws a green square to the top-left corner:

square = canvas.create_rectangle(0,0,150,150, fill="green")

create_rectangle takes four positional arguments representing the top-left and bottom-right coordinates of the rectange, and then a list of optional named parameters. In this case we set the fill colour to green. For a full list, you can browse the documentation for Tkinter rectangles here.

Likewise, you can draw other shapes to the canvas. The create_oval canvas method works in the same way as the create_rectangle method, except that it draws the ellipse contained within the bounding rectangle. The following line draws a blue circle directly below the square:

circle = canvas.create_oval(0,150,150,300, fill="blue")

The next basic shape type to learn is the polygon, which allows you to draw objects of any shape. The create_polygon method takes in any number of positions and draws the shape that is formed by using all the positions as vertices. The following example draws a red diamond to the right of the square:

diamond = canvas.create_polygon(150,75,225,0,300,75,225,150, fill="red")

Polygons could have any amount of points, so you could have just as easily drawn a five, six or seven sided shape here, rather than a diamond.

Lastly you can add text to the canvas by using the create_text method. This method takes the centre point of the text object, then optional arguments including the colour. The most important of these arguments is text which is the text to be written to the canvas. In the following example we write some simple text to the bottom-right corner of the window:

text = canvas.create_text(230,230, text="Tkinter canvas", fill="purple", 
        font=("Helvectica", "16"))

We also manually set the font, to make the text appear larger. At their simplest, font's are simply a tuple containing a font name and size — in this case, 16 point Helvectica.

Deleting items from the canvas

You may have noticed that we've been storing the value returned by the create methods used to add shapes to the canvas. Each creation method returns an object indentifier, which allows us to manipulate the objects after they have been added.

You can delete any item from the canvas by using canvas.delete:

canvas.delete(square)
canvas.delete(text)

By adding and removing items from the canvas, you can create more sophisticated and customised feedback to users of your applications. The canvas is highly customisable and allows more complicated interactions with objects.

Stay tuned in the coming weeks when we'll explore freeform GUIs using Python in more detail.

Editor's Picks

Free Newsletters, In your Inbox