一、問題
在做連連看的時候需要加一個計時器的動畫,這樣就完成了計時功能的設計。
二、解決
主要思路:
1、先產生一個畫布,用深顏色填充滿。
2、產生一個新的矩陣用來覆蓋畫布,背景用白色,就可以渲染出來遞減的感覺
3、動態改變填充的位置,就完成增加和減少時間的動畫效果

1 # 時間畫布、動畫
2 self.time_counter = tk.Canvas(self.root, width=22, height=180, bg="yellow") 3 self.time_counter.place(x=615, y=80) 4
5 # 時間顯示
6 self.show_time = tk.Label(self.root, bg="lightgrey", fg="purple", font="葉根友毛筆行書2.0版 15 bold", text=f"剩余時間\n{self.__time}s") 7 self.show_time.place(x=590, y=20) 8
9 # 計時函數
10 def counter(self): 11 """
12 計時柱的構建 13 :return: 14 """
15 try: 16 fill_line = self.time_counter.create_rectangle(1.5, 1.5, 23, 0, width=0, fill="white") 17 while self.__cycle >= 0: # self.time 做循環量處理
18 self.n += self.__scalar
19 # 移動開始減少
20 self.time_counter.coords(fill_line, (0, 0, 80, self.n)) 21 self.root.update() 22 self.__time -= 1
23 self.show_time.configure(text=f"剩余時間\n{self.__time}s", fg="purple") 24 time.sleep(1.0) # 控制進度條流動的速度 1秒一次
25 # 時間結束 游戲結束 退出
26 if self.__time == 0: 27 tk.messagebox.showinfo("Tip", f"最后分數:{self.__score}") 28 self.__game_start = False 29 exit() 30 self.__cycle = self.__time # 保證了和時間的一致性
31 except Exception as e: 32 _ = e.__traceback__
33 exit() 34
35 # 需要動態處理
36 def detail(self): 37 """
38 消完之后做加分處理 加時處理 39 :return: 40 """
41 # 加分處理
42 self.__score += self.__score_level * self.__score_base
43 self.show_score.configure(text=f"分數\n{self.__score}", fg="red") 44
45 # 加時處理
46 # 由於一秒一減少 所以self.n的值和self.__time的值一樣
47 self.__time += self.__add_time
48 self.n -= self.__scalar * self.__add_time
49 # 將溢出的全部刪除
50 if self.__time >= self.__large_time: 51 self.show_time.configure(text=f"剩余時間\n{self.__large_time}s", fg="purple") 52 self.__time = self.__large_time
53 self.n = 0 54 else: 55 self.show_time.configure(text=f"剩余時間\n{self.__time}s", fg="purple")
三、結果呈現
四、總結
1、在使用的過程中,需要考慮循環的一致性,因此要采取while進行循環,而不是for。
2、為了保證在任何情況下都可以使用,因此我用速率來控制增加量
3、對游戲能否繼續進行,進行判斷不可以退出游戲
五、參考
如何做一個進度條,反過來就是一個時間計時器
GitHub鏈接:https://github.com/pzq7025/game