【python基礎】 Tkinter小構件之canvas 畫布

【python之tkinter畫布】

 本文代碼來源於機械工業出版社的一本python書籍.

要畫布就要使用tkinter的小構件，canvas(結構化的圖形，用於繪制圖形，創建圖形編輯器以及實現自定制的小構件類)

 

我們先使用create_rectangle, create_oval, create_arc, create_polygon, create_line分別繪制矩形，橢圓，圓弧，多邊形，線段。

 

創建CanvasDemo.py的文件，代碼如下：

# -*- coding: utf-8 -*-
###################
#畫布，使用Canvas小構件
###################
from Tkinter import *

class CanvasDemo:
    def __init__(self):
        window = Tk() #創建窗口
        window.title("Canvas Demo") #給窗口命名

        #在窗口畫布
        self.canvas = Canvas(window, width = 200, height = 100, bg = "white")
        self.canvas.pack()

        #創建frame的框架，窗口window為這個框架的父容器
        frame = Frame(window)
        frame.pack()
        #frame框架作為Button的父容器
        btRectangle = Button(frame, text="rectangle", command = self.displayRect)
        btOval = Button(frame, text = "Oval", command = self.displayOval)
        btArc = Button(frame, text = "Arc", command = self.displayArc)
        btPolygon = Button(frame, text = "Polygon", command = self.displayPolygon)
        btLine = Button(frame, text = "Line", command = self.displayLine)
        btString = Button(frame, text = "String", command = self.displayString)
        btClear = Button(frame, text = "Clear", command = self.displayClear)

        #Button在畫布上布局
        btRectangle.grid(row = 1, column = 1)
        btOval.grid(row = 1, column = 2)
        btArc.grid(row = 1, column = 3)
        btPolygon.grid(row = 1, column = 4)
        btLine.grid(row = 1, column = 5)
        btString.grid(row = 1, column = 6)
        btClear.grid(row = 1, column = 7)

        #創建事件循環直到關閉主窗口
        window.mainloop()

    def displayRect(self):
        self.canvas.create_rectangle(10,10,190,90,tags = "rect")

    #fill填充oval的顏色
    def displayOval(self):
        self.canvas.create_oval(10,10,190,90, fill = "red", tags = "oval")

    # start為開始的度數，extent為要轉的度數.全部以逆時針為正方向，0為x軸正方向
    def displayArc(self):
        self.canvas.create_arc(10,10,190,90, start = 0, extent = 90, width = 8, fill = "red",tags = "arc")

    def displayPolygon(self):
        self.canvas.create_polygon(10,10,190,90,10,90,tags = "polygon")

    #arrow表示line指向，activefill：當鼠標在line上時出現的特定風格，本例中鼠標移動到第二個line上時line變藍
    def displayLine(self):
        self.canvas.create_line(10,10,190,90,fill = "red",tags = "line")
        self.canvas.create_line(10,90,190,10,width = 9,arrow = "first",activefill = "blue", tags = "line")

    #font定義字體（字體名，大小，風格）
    def displayString(self):
        self.canvas.create_text(60,40,text= "hi, i am string", font = "time 10 bold underline", tags = "string")

    #delete方法通過tags參數從畫布上刪除圖形
    def displayClear(self):
        self.canvas.delete("rect","oval","arc","polygon","line","string")

CanvasDemo()

 

運行程序即可。

 

 

可能你不知道create_xx()里的數字意思，其實是坐標（x1,y1）,（x2,y2）,（x3,y3）create_xx(x1,y1,x2,y2,x3,y3)

Tkinter的坐標系是這樣的：

 

 

2018.4.25更新: 經過Pangolin２ 的提醒上圖錯了, 在python3.6中x為橫向(向右為正方向), y為縱向(向下為正方向), 偷個懶, 圖就不改了哈.