Introduction

Basic Widgets

Toplevel Widgets

Geometry Management

Binding Functions

Working with Images in Tkinter

Tkinter Advance

Applications and Projects

Canvas Widget in Tkinter

The Canvas widget in tkinter provides the tools to draw graphics on your application. Whether you want to create lines, polygons, ovals, or just put image and text on it, Canvas has you covered.

Let's explore how to use the Canvas widget in tkinter:

Canvas Widget in tkinter Tutorial:

1. Import Required Libraries:

import tkinter as tk

2. Basic Canvas Creation:

You can create a basic canvas widget like this:

root = tk.Tk()
canvas = tk.Canvas(root, bg="white", width=400, height=400)
canvas.pack(pady=20)

3. Drawing on Canvas:

i. Drawing a Line:

canvas.create_line(10, 10, 200, 50)

ii. Drawing a Rectangle:

canvas.create_rectangle(50, 50, 150, 150, fill="blue")

iii. Drawing an Oval:

canvas.create_oval(50, 200, 150, 250, fill="yellow")

iv. Drawing a Polygon:

canvas.create_polygon(200, 200, 240, 240, 220, 270, fill="green")

v. Placing Text:

canvas.create_text(300, 300, text="Tkinter Canvas", font=("Arial", 14))

4. Event Handling on Canvas:

You can also bind events to the canvas to make it interactive. Let's say we want to draw a circle wherever we click on the canvas:

def draw_circle(event):
    x, y = event.x, event.y
    r = 20
    canvas.create_oval(x-r, y-r, x+r, y+r, fill="red")

canvas.bind("<Button-1>", draw_circle)

Complete Code:

import tkinter as tk

def draw_circle(event):
    x, y = event.x, event.y
    r = 20
    canvas.create_oval(x-r, y-r, x+r, y+r, fill="red")

root = tk.Tk()
canvas = tk.Canvas(root, bg="white", width=400, height=400)
canvas.pack(pady=20)

# Drawing
canvas.create_line(10, 10, 200, 50)
canvas.create_rectangle(50, 50, 150, 150, fill="blue")
canvas.create_oval(50, 200, 150, 250, fill="yellow")
canvas.create_polygon(200, 200, 240, 240, 220, 270, fill="green")
canvas.create_text(300, 300, text="Tkinter Canvas", font=("Arial", 14))

# Event binding
canvas.bind("<Button-1>", draw_circle)

root.mainloop()

This is just scratching the surface of what you can do with the Canvas widget. By harnessing its capabilities and combining it with event handling, you can create a myriad of graphical applications, games, and tools in tkinter.

  1. Creating a Canvas in Tkinter:

    • Description: Tkinter provides a Canvas widget that serves as a drawing area for creating graphics and interactive elements.
    • Code:
      import tkinter as tk
      
      root = tk.Tk()
      canvas = tk.Canvas(root, width=400, height=300)
      canvas.pack()
      
      root.mainloop()
      
  2. How to use Canvas widget in Tkinter:

    • Description: The Canvas widget is used to create a drawable area in a Tkinter application. It allows you to draw shapes, images, and other graphical elements.
    • Code: (Building upon the previous example)
      canvas.create_line(0, 0, 200, 100, fill="blue")
      canvas.create_rectangle(50, 50, 150, 150, fill="red")
      
      root.mainloop()
      
  3. Drawing shapes on Canvas in Tkinter:

    • Description: You can draw various shapes on the Canvas using methods like create_line, create_rectangle, create_oval, etc.
    • Code:
      canvas.create_line(10, 10, 100, 100, fill="green")
      canvas.create_oval(120, 10, 220, 100, fill="yellow")
      
      root.mainloop()
      
  4. Adding images to Tkinter Canvas:

    • Description: You can add images to the Canvas using the create_image method. This is useful for displaying icons, logos, or other visual elements.
    • Code:
      photo = tk.PhotoImage(file="image.gif")
      canvas.create_image(50, 50, anchor=tk.NW, image=photo)
      
      root.mainloop()
      
  5. Interactive drawing with Canvas in Tkinter:

    • Description: Tkinter allows you to handle events like mouse clicks, drags, and key presses to create interactive drawing applications.
    • Code:
      def draw(event):
          x, y = event.x, event.y
          canvas.create_oval(x-5, y-5, x+5, y+5, fill="black")
      
      canvas.bind("<B1-Motion>", draw)
      
      root.mainloop()