liveBook · Manning

Canvas element

As explained in Get Programming: Learn to code with Python

The HTML canvas element is a scriptable bitmap drawing surface in a web document for rendering graphics.

A canvas is a rectangular Tkinter widget where a program can place shapes and other graphical objects. Shapes belong to the canvas, not directly to the window. A rectangle can be described by four coordinates: its top-left and bottom-right corners. section 38.2

Player pieces in a tag game

A tag game can place two colored rectangles on one canvas. Each rectangle gets a random position and size, so the pieces look different each time the program runs. section 38.2

Listing 38.1. Initializing a window and widgets
import tkinter
window = tkinter.Tk()
window.geometry("800x800")
window.title("Tag!")
canvas = tkinter.Canvas(window)                  #1
canvas.pack(expand=1, fill='both')               #2

See how a Tkinter canvas is added to a window and expanded to fill it. section 38.2

How Get Programming: Learn to code with Python covers it

How deep it goes
Defines the canvas as a rectangular widget and demonstrates colored rectangles, but stops short of detailing its full drawing API.
Examples
Uses two randomly positioned, differently sized player rectangles in a tag game.
What you can do after
Build it from scratch by adding a canvas to a Tkinter window and placing shapes on it.
How it connects
Connects Tkinter canvases with GUI widgets, shapes, classes, and event handlers.

Also explained in

Compare how 4 books explain canvas element →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of Get Programming: Learn to code with Python. The section links point to the parts of the book it draws on.