資源簡介

(共27張PPT)
Tkinter
動畫
課前回顧
1、創建按鈕
2、繪制圖形
3、設置顏色
button1 = Button(windows1, text='點擊我', command=printStr)
canvas = Canvas(object1, width=600, height=500)
canvas.create_rectangle(30, 30, 150, 150)
colorTuple = colorchooser.askcolor()
情境引入
之前所學的課程中，我們講述了如何使用turtle、tkinter模塊內的方法來畫出靜態的圖，都是一些不會動的畫。Tkinter模塊內有許多可以繪制動畫的函數，那現在我們來一起繪制真正的動畫。
循序善誘
動畫并不是tkinter模塊的專長，但是基本的處理還是可以做的。本節課，我們來一起制作一幅動畫。
新知教授
2、繪制火箭
1、創建動畫
3、發射火箭
4、課堂總結
創建動畫
新知教授
我們來創建一個填色三角形，編寫程序讓它在屏幕上橫向移動。
編玩邊學
import time
from tkinter import*
tk = Tk()
canvas = Canvas(tk, width=800, height=600)
canvas.pack()
canvas.create_polygon(10, 10, 10, 120, 100, 60)
for x in range(0, 670):
canvas.move(1, 1, 0)
tk.update()
time.sleep(0.01)
運行這段代碼時，三角形會從屏幕一邊橫向移動到另一邊
思維構建
canvas.create_polygon(10, 10, 10, 120, 100, 60)
使用函數創建三角形
注意：如果我們使用print(canvas.create_polygon(10, 10, 10, 120, 100, 60 ))，屏幕上會打印出一個數字，這個數值是這個多邊形的ID，可以理解為繪制出來這個圖形的身份證號，我們可以用這個ID來代指這個形狀，并使用其他功能函數控制它。
思維構建
canvas.move()函數會把任意畫好的對象移動到x、y坐標增加給定值的位置。例如，canvas.move(1, 1, 0)會把id為1的對象（那個三角形的id標識）橫移1個像素，縱移0個像素。
思維構建
函數tk.update()強制tkinter 更新屏幕。 如果沒用update，tkinter 會等到循環結束時才會移動三角形，這樣只會看到它跳到最后的位置，而不是平滑地穿過畫布。
繪制火箭
思維構建
使用函數繪制出火箭形狀
編玩邊學
from tkinter import*
tk = Tk()
canvas = Canvas(tk, width=800, height=800)
canvas.pack()
canvas.create_polygon(350, 350, 400, 350, 375, 300)
canvas.create_polygon(300, 600, 350, 600, 350, 500)
canvas.create_polygon(450, 600, 400, 600, 400, 500)
canvas.create_rectangle(350, 350, 400, 600, fill='white')
tk.mainloop()
使用三角形與矩形進行組合成一個火箭，火箭里包含了三個個三角形與一個矩形。
思維構建
再為火箭寫上文字
編玩邊學
canvas.create_text(375, 400, text='吉', fill='blue', font=('Times', 30))
canvas.create_text(375, 450, text='碼', fill='blue', font=('Times',30))
canvas.create_text(375, 500, text='二', fill='blue', font=('Times', 30))
canvas.create_text(375, 550, text='號', fill='blue', font=('Times', 30))
為火箭表面的文字設置合適的位置、大小與字體格式
思維構建
最后為火箭添加上尾焰
編玩邊學
canvas.create_polygon(350, 600, 370, 600, 360, 620, fill='red')
canvas.create_polygon(380, 600, 400, 600, 390, 620, fill='red')
在火箭尾端畫上兩個尾焰，并填充顏色。
發射火箭
新知教授
剛剛已經繪制好了火箭，我們知道畫布中的火箭包含多個圖形與文字，發射火箭就需要讓這些圖形與文字同步移動。我們該如何實現呢？是否還記得在畫布中，每當有一個圖形元素繪制出來，Python就會為它定制一個ID，我們對圖形的控制，也轉化成了對ID的控制。
編學邊玩
print(canvas.create_polygon(350, 350, 400, 350, 375, 300))
print(canvas.create_polygon(300, 600, 350, 600, 350, 500))
print(canvas.create_polygon(450, 600, 400, 600, 400, 500))
print(canvas.create_rectangle(350, 350, 400, 600, fill='white'))
print(canvas.create_polygon(350, 600, 370, 600, 360, 620, fill='red'))
print(canvas.create_polygon(380, 600, 400, 600, 390, 620, fill='red'))
print(canvas.create_text(375, 400, text='吉', fill='blue', font=('Times', 30)))
print(canvas.create_text(375, 450, text='碼', fill='blue', font=('Times',30)))
print(canvas.create_text(375, 500, text='二', fill='blue', font=('Times', 30)))
print(canvas.create_text(375, 550, text='號', fill='blue', font=('Times', 30)))
上述程序輸出打印結果是：1、2、3、4、5、6、7、8、9、10，分別代表每個圖形和文字的ID。
思維構建
經過查看，我們已經知道了每個組成火箭的圖形與文字的ID，下面我們來對整個火箭進行移動。
編學邊玩
for x in range(0, 200):
canvas.move(1, 0, -2)
canvas.move(2, 0, -2)
canvas.move(3, 0, -2)
canvas.move(4, 0, -2)
canvas.move(5, 0, -2)
canvas.move(6, 0, -2)
canvas.move(7, 0, -2)
canvas.move(8, 0, -2)
canvas.move(9, 0, -2)
canvas.move(10, 0, -2)
tk.update()
time.sleep(0.01)
知道了火箭中每個圖案的ID，所以在for循環里只需要對與圖形綁定的ID進行控制，就可以來完成火箭整體的移動。
實踐創作
完成本節課的程序，嘗試使用tkinter創作屬于自己的動畫作品。
課堂總結
1、創建動畫
2、繪制火箭
3、發射火箭
canvas.move()函數會把任意畫好的對象移動到x、y坐標增加給定值的位置。
使用三角形與矩形進行組合成一個火箭，添加文字，繪制火箭尾焰。
對組成火箭圖形與文字綁定的ID進行控制，就可以來完成火箭整體的移動。
分享交流
同學們今天寫代碼有沒有遇到什么問題？
演示今天打印的代碼
同學們，要加油哦！
下節課見啦

展開更多......

收起↑