1.7 Canvas 画布

说明

Canvas 是 Tkinter 中用于绘制图形和图像的组件。它支持绘制线条、矩形、椭圆、多边形、文本等，还可以显示图像和处理用户交互事件。

创建

canvas = tk.Canvas(root)

• 作用：创建一个画布对象。
• 参数：
• root：父容器（通常是根窗口或其他容器）。

常用选项

以下是 Canvas 的常用配置选项：

bg（background）

• 说明：设置画布的背景颜色。
• 示例：

canvas = tk.Canvas(root, bg="lightblue")

width 和 height

• 说明：设置画布的宽度和高度（以像素为单位）。
• 示例：

canvas = tk.Canvas(root, width=400, height=300)

bd（borderwidth）

• 说明：设置画布的边框宽度。
• 示例：

canvas = tk.Canvas(root, bd=2)

relief

• 说明：设置画布的边框样式。
• "flat"：无边框（默认）。
• "raised"：凸起边框。
• "sunken"：凹陷边框。
• "groove"：凹槽边框。
• "ridge"：脊状边框。
• 示例：

canvas = tk.Canvas(root, relief="sunken")

scrollregion

• 说明：设置画布的可滚动区域（格式为 (x1, y1, x2, y2)）。
• 示例：

canvas = tk.Canvas(root, scrollregion=(0, 0, 800, 600))

xscrollcommand 和 yscrollcommand

• 说明：设置水平滚动条和垂直滚动条的回调函数。
• 示例：

h_scrollbar.config(command=canvas.xview) 
v_scrollbar.config(command=canvas.yview)

常用方法

以下是 Canvas 的常用方法：

create_line(x1, y1, x2, y2, options)

• 说明：绘制一条直线。
• 参数：
• x1, y1：起点坐标。
• x2, y2：终点坐标。
• options：可选参数，如 fill（颜色）、width（线宽）等。
• 示例：

canvas.create_line(10, 10, 100, 100, fill="red", width=2)

create_rectangle(x1, y1, x2, y2, options)

• 说明：绘制一个矩形。
• 参数：
• x1, y1：左上角坐标。
• x2, y2：右下角坐标。
• options：可选参数，如 fill（填充颜色）、outline（边框颜色）等。
• 示例：

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

create_oval(x1, y1, x2, y2, options)

• 说明：绘制一个椭圆。
• 参数：
• x1, y1：左上角坐标。
• x2, y2：右下角坐标。
• options：可选参数，如 fill（填充颜色）、outline（边框颜色）等。
• 示例：

canvas.create_oval(100, 100, 200, 150, fill="green", outline="black")

create_polygon(x1, y1, x2, y2, ..., options)

• 说明：绘制一个多边形。
• 参数：
• x1, y1, x2, y2, ...：多边形的顶点坐标。
• options：可选参数，如 fill（填充颜色）、outline（边框颜色）等。
• 示例：

canvas.create_polygon(50, 50, 100, 100, 150, 50, fill="yellow", outline="black")

create_text(x, y, options)

• 说明：绘制文本。
• 参数：
• x, y：文本的坐标。
• options：可选参数，如 text（文本内容）、font（字体）、fill（颜色）等。
• 示例：

canvas.create_text(100, 100, text="Hello, Canvas!", font=("Arial", 12), fill="black")

create_image(x, y, options)

• 说明：绘制图像。
• 参数：
• x, y：图像的坐标。
• options：可选参数，如 image（图像对象）、anchor（锚点）等。
• 示例：

image = tk.PhotoImage(file="image.png") 
canvas.create_image(100, 100, image=image, anchor="nw")

delete(item)

• 说明：删除指定的图形或图像。
• 示例：

canvas.delete(line) # 删除线条

itemconfig(item, options)

• 说明：修改指定图形或图像的属性。
• 示例：

canvas.itemconfig(rect, fill="red") # 修改矩形的填充颜色

coords(item, x1, y1, x2, y2)

• 说明：修改指定图形或图像的坐标。
• 示例：

canvas.coords(rect, 50, 50, 200, 200) # 修改矩形的坐标

bind(event, callback)

• 说明：绑定事件（如鼠标点击、键盘输入等）。
• 示例：

canvas.bind("", on_click) # 绑定鼠标左键点击事件

示例演示

以下是一个完整的示例，展示如何使用 Canvas 绘制图形和图像：

import tkinter as tk

# 创建根窗口
root = tk.Tk()
root.title("Canvas 示例")
root.geometry("500x400")

# 创建并配置画布
canvas = tk.Canvas(root, bg="white", width=400, height=300, bd=2, relief="sunken")
canvas.pack(pady=10)

# 绘制直线
line = canvas.create_line(10, 10, 100, 100, fill="red", width=2)

# 绘制矩形
rect = canvas.create_rectangle(50, 50, 150, 150, fill="blue", outline="black")

# 绘制椭圆
oval = canvas.create_oval(100, 100, 200, 150, fill="green", outline="black")

# 绘制多边形
polygon = canvas.create_polygon(50, 50, 100, 100, 150, 50, fill="yellow", outline="black")

# 绘制文本
text = canvas.create_text(100, 200, text="Hello, Canvas!", font=("Arial", 12), fill="black")

# 绘制图像
image = tk.PhotoImage(file="python_logo.png")  # 请替换为你的图片路径
canvas.create_image(300, 100, image=image, anchor="nw")

# 定义鼠标点击事件
def on_click(event):
    print(f"点击位置：({event.x}, {event.y})")

# 绑定鼠标点击事件
canvas.bind("", on_click)

# 启动主循环
root.mainloop()

代码说明

画布：

• 背景颜色为白色。
• 宽度为 400，高度为 300。
• 边框宽度为 2，边框样式为凹陷（sunken）。

绘制图形：

• 绘制一条红色直线。
• 绘制一个蓝色矩形。
• 绘制一个绿色椭圆。
• 绘制一个黄色多边形。
• 绘制文本“Hello, Canvas!”。

绘制图像：

• 加载并显示图片（请确保图片路径正确）。

事件绑定：

• 绑定鼠标左键点击事件，点击画布时打印点击位置的坐标。

运行效果

1. 窗口大小为 500x400。
2. 画布中显示绘制的图形和图像。
3. 点击画布时，控制台会输出点击位置的坐标。

注意事项

• 如果使用图片，请确保图片路径正确，并且图片格式支持（如 PNG、GIF）。
• PhotoImage 对象需要保持引用，否则图片可能无法显示。可以将图片对象保存为全局变量或类的属性。

通过这个示例，你可以掌握 Canvas 的基本用法，并根据需要绘制图形和图像。