python tkinter canvas


Canvas 的坐標系統是繪圖的基礎,其中點 (0,0) 位於 Canvas 組件的左上角,X 軸水平向右延伸,Y 軸垂直向下延伸。

 

  • create_arc:繪制弧。
  • create_bitmap:繪制位圖。
  • create_image:繪制圖片。
  • create_line():繪制直線。
  • create_polygon:繪制多邊形。
  • create_text:繪制文字。
  • create_window:繪制組件。
  •  create_rectangle() 方法繪制矩形
  • create_oval() 方法繪制橢圓(包括圓,圓是橢圓的特例)

繪制上面這些圖形時需要簡單的幾何基礎:

  • 在使用 create_line() 繪制直線時,需要指定兩個點的坐標,分別作為直線的起點和終點。
  • 在使用 create_rectangle() 繪制矩形時,需要指定兩個點的坐標,分別作為矩形左上角點和右下角點的坐標。
  • 在使用 create_oval() 繪制橢圓時,需要指定兩個點的坐標,分別作為左上角點和右下角點的坐標來確定一個矩形,而該方法則負責繪制該矩形的內切橢圓,如圖 2 所示。


圖 2 內切橢圓


從圖 2 可以看出,只要矩形確定下來,該矩形的內切橢圓就能確定下來,而 create_oval() 方法所需要的兩個坐標正是用於指定該矩形的左上角點和右下角點的坐標。

在使用 create_arc 繪制弧時,和 create_oval 的用法相似,因為弧是橢圓的一部分,因此同樣也是指定左上角和右下角兩個點的坐標,默認總是繪制從 3 點(0)開始,逆時針旋轉 90° 的那一段弧。程序可通過 start 改變起始角度,也可通過 extent 改變轉過的角度。

在使用 create_polygon 繪制多邊形時,需要指定多個點的坐標來作為多邊形的多個定點;在使用 create_bitmap、create_image、create_text、create_window 等方法時,只要指定一個坐標點,用於指定目標元素的繪制位置即可。

在繪制這些圖形時可指定如下選項:

    • fill:指定填充顏色。如果不指定該選項,默認不填充。
    • outline:指定邊框顏色。
    • width:指定邊框寬度。如果不指定該選項,邊框寬度默認為 1。
    • dash:指定邊框使用虛線。該屬性值既可為單獨的整數,用於指定虛線中線段的長度;也可為形如(5,2,3)格式的元素,此時5 指定虛線中線段的長度,2 指定間隔長度,3 指定虛線長度……依此類推。
    • stipple:使用位圖平鋪進行填充。該選項可與 fill 選項結合使用,fill 選項用於指定位圖的顏色。
    • style:指定繪制弧的樣式。該選項僅對 create_arc 方法起作用。該選項支持 PIESLICE(扇形)、CHORD(弓形)、ARC(僅繪制弧)選項值。
    • start:指定繪制弧的起始角度。該選項僅對 create_arc 方法起作用。
    • extent:指定繪制弧的角度。該選項僅對 create_arc 方法起作用。
    • arrow:指定繪制直線時兩端是否有箭頭。該選項支持 NONE(兩端無箭頭)、FIRST(開始端有箭頭)、LAST(結束端有箭頭)、BOTH(兩端都有箭頭)選項值。
    • arrowshape:指定箭頭形狀。該選項是一個形如 "20 20 10" 的字符串,字符串中的三個整數依次指定填充長度、箭頭長度、箭頭寬度。
    • joinstyle:指定直接連接點的風格。僅對繪制直線和多向形有效。該選項支持 METTER、ROUND、BEVEL 選項值。
    • anchor:指定繪制文字、GUI 組件的位置。該選項僅對 create_text()、create_window() 方法有效。
    • justify:指定文字的對齊方式。該選項支持 CENTER、LEFT、RIGHT 常量值,該選項僅對 create_text 方法有效。
from tkinter import *

root = Tk()

root.title('missWjz')

cv = Canvas(root,background='white',width=830,height=830)
cv.pack(fill=BOTH,expand=YES)

#對字體進行初始化,字體樣式,字體大小,字體是否加粗
columnFont = ('微軟雅黑',18)
titleFont = ('微軟雅黑',15,'bold')

#采用循環打印字體
for i,str in enumerate(['默認', '指定邊寬', '指定填充', '邊框顏色', '位圖填充']):
    cv.create_text((130 + i*140,20),text=str,
                   font = columnFont,   #字體
                   fill = 'red',        #填充顏色
                   anchor = W,          #對齊方式
                   justify = LEFT
                   )


#繪制字體
cv.create_text((10,80),text="繪制矩形",
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT
            )

#創建列表:圖形邊框大小 填充色 邊框顏色 位圖填充
options = [(None,None,None,None),
           (4,None,None,None),
           (4,'pink',None,None),
           (4,'pink','red',None),
           (4,'pink','red','error')]

#創建矩形圖案
for i,opt in enumerate(options):
    cv.create_rectangle((130+i*140,50,240+i*140,120),
                        width = opt[0],     #邊框寬度
                        fill = opt[1],      #圖案填充色
                        outline = opt[2],   #圖案邊框顏色
                        stipple = opt[3]    #位圖填充
                        )

#繪制字體
cv.create_text((10,190),text='繪制橢圓',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT
               )

#繪制橢圓
for i,opt in enumerate(options):
    cv.create_oval((130+i*140,150,240+i*140,220),
                   width = opt[0],
                   fill = opt[1],
                   outline = opt[2],
                   stipple = opt[3])

#繪制文字
cv.create_text((10,300),text='繪制多邊形',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT)

#繪制 五角星
for i,opt in enumerate(options):
    cv.create_polygon((130+i*140,270,240+i*140,270,152+i*140,350,185+i*140,230,218+i*140,350,130+i*140,270),
                      width = opt[0],
                      fill = opt[1],
                      outline = opt[2],
                      stipple = opt[3])

#繪制文字
cv.create_text((10,410),text='繪制扇形',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT)

#繪制扇形 提供兩個坐標
for i,opt in enumerate(options):
    cv.create_arc((130+i*140,380,240+i*140,460),
                  width = opt[0],
                  fill = opt[1],
                  outline = opt[2],
                  stipple = opt[3],
                  )

#繪制文字
cv.create_text((10,520),text='繪制弓形',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT)
#繪制弓形
for i,opt in enumerate(options):
    cv.create_arc((130+i*140,490,240+i*140,570),
                  width = opt[0],
                  fill = opt[1],
                  outline = opt[2],
                  stipple = opt[3],
                  start = 30,   #起始角度
                  extent = 180, #逆時針轉過角度
                  style =  CHORD    #弓張開的方式
                  )

#繪制文字
cv.create_text((10,630),text='僅繪弧',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT)
#僅繪制弧
for i,opt in enumerate(options):
    cv.create_arc((130+i*140,600,240+i*140,680),
                  width = opt[0],
                  fill = opt[1],
                  outline = opt[2],
                  stipple = opt[3],
                  start = 30,   #起始角度
                  extent = 180, #逆時針轉過角度
                  style =  ARC    #弓張開的方式
                  )
#繪制文字
cv.create_text((10,740),text='繪制直線',
               font = titleFont,
               fill = 'blue',
               anchor = W,
               justify = LEFT)
#繪制直線
options = [(None,None,None,None,None),
           (6,None,None,BOTH,(20,40,10)),   #BOTH:兩頭都有箭頭;長度,箭頭長度,寬度
           (6,'pink',None,FIRST,(40,40,10)),
           (6,'pink',None,LAST,(60,50,10)),
           (8,'pink','error',None,None)]

for i,opt in enumerate(options):
    cv.create_line((130+i*140,710,240+i*140,790),
                   width = opt[0],
                   fill = opt[1],
                   stipple = opt[2],
                   arrow = opt[3],
                   arrowshape=opt[4]#arroeshape形如 "20 20 10" 的字符串,字符串中的三個整數依次指定填充長度、箭頭長度、箭頭寬度
                   )

root.mainloop()

效果圖:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM