目录

前言

项目背景

项目展示（图片）

项目实现

1. 安装与设置

2. 创建主窗口

3. 初始化计时器功能

4. 实现计时功能

5. 实现隐藏边框与置顶功能

6. 运行应用

完整代码

结论

---

🌟 嗨，我是命运之光！

🌍 2024，每日百字，记录时光，感谢有你一路同行。

🚀 携手启航，探索未知，激发潜能，每一步都意义非凡。

---

前言

在这篇博客笔记中，我将分享如何使用 Python 的 ttkbootstrap 库创建一个外观现代、炫酷的计时器应用程序。这个计时器能够精确到秒，并且具备隐藏窗口边框、置顶窗口的功能。

项目背景

我希望通过这个项目来探索 ttkbootstrap 库，该库提供了一种更现代和更具美感的方式来构建基于 Tkinter 的 GUI 应用程序。目标是创建一个简单、功能齐全的计时器，并为按钮添加一些交互效果，使界面更具吸引力。

项目展示（图片）

可以记录时间，精确到秒 

可以隐藏边框（点击后隐藏边框加窗口置顶）

项目实现

1. 安装与设置

首先，确保你已经安装了 ttkbootstrap。如果还没有，可以使用以下命令进行安装：

pip install ttkbootstrap

2. 创建主窗口

我们使用 tkinter 创建主窗口，并通过 ttkbootstrap 的 Style 对象来设置应用的主题。在本例中，我们选择了一个现代的 vapor 主题。

import tkinter as tk
from ttkbootstrap import Style
from ttkbootstrap import ttk
import timeclass TimerApp(tk.Tk):def __init__(self):super().__init__()self.title("计时器")self.geometry("220x100")# 设置样式style = Style(theme='vapor')  # 使用现代的 'vapor' 主题

3. 初始化计时器功能

我们需要一个标签来显示时间，并且提供“开始/停止”、“重置”以及“隐藏边框”三个按钮。每个按钮都使用不同的 ttkbootstrap 样式，使其看起来更有设计感。

        # 初始化计时器变量self.start_time = Noneself.running = Falseself.decorated = True  # 初始状态为显示边框# 标签显示时间self.time_label = ttk.Label(self, text="00:00:00", font=("Helvetica", 24))self.time_label.pack(pady=10)# 开始/停止按钮self.start_button = ttk.Button(self, text="开始", command=self.start_stop, style='info.TButton')self.start_button.pack(side=tk.LEFT, padx=5)# 重置按钮self.reset_button = ttk.Button(self, text="重置", command=self.reset, style='warning.TButton')self.reset_button.pack(side=tk.LEFT, padx=5)# 切换边框按钮self.toggle_button = ttk.Button(self, text="隐藏边框", command=self.toggle_border, style='success.TButton')self.toggle_button.pack(side=tk.LEFT, padx=5)

4. 实现计时功能

接下来，我们定义了 update_time、start_stop 和 reset 方法来控制计时器的逻辑。

    def update_time(self):if self.running:elapsed_time = int(time.time() - self.start_time)hours, remainder = divmod(elapsed_time, 3600)minutes, seconds = divmod(remainder, 60)self.time_label.config(text=f"{hours:02}:{minutes:02}:{seconds:02}")self.after(1000, self.update_time)def start_stop(self):if not self.running:self.start_time = time.time() - (int(self.time_label.cget("text").split(":")[0]) * 3600 + int(self.time_label.cget("text").split(":")[1]) * 60 +int(self.time_label.cget("text").split(":")[2]))self.running = Trueself.start_button.config(text="停止", style='danger.TButton')self.update_time()else:self.running = Falseself.start_button.config(text="开始", style='info.TButton')def reset(self):self.running = Falseself.start_button.config(text="开始", style='info.TButton')self.time_label.config(text="00:00:00")

5. 实现隐藏边框与置顶功能

我们通过 toggle_border 方法来实现隐藏窗口边框和置顶窗口的功能。当用户点击按钮时，窗口会切换边框的显示状态，并且保持在所有窗口的最前端。

    def toggle_border(self):if self.decorated:self.overrideredirect(True)  # 隐藏边框self.wm_attributes("-topmost", True)  # 将窗口置顶self.toggle_button.config(text="显示边框", style='primary.TButton')else:self.overrideredirect(False)  # 显示边框self.wm_attributes("-topmost", False)  # 取消置顶self.toggle_button.config(text="隐藏边框", style='success.TButton')self.decorated = not self.decorated  # 切换状态

6. 运行应用

最后，我们使用 if __name__ == "__main__": 块来启动应用程序。

if __name__ == "__main__":app = TimerApp()app.mainloop()

完整代码

import tkinter as tk
from ttkbootstrap import Style
from ttkbootstrap import ttk
import timeclass TimerApp(tk.Tk):def __init__(self):super().__init__()self.title("计时器")self.geometry("220x100")# 设置样式style = Style(theme='vapor')  # 尝试使用一个更现代的主题# 初始化计时器变量self.start_time = Noneself.running = Falseself.decorated = True  # 初始状态为显示边框# 标签显示时间self.time_label = ttk.Label(self, text="00:00:00", font=("Helvetica", 24))self.time_label.pack(pady=10)# 开始/停止按钮self.start_button = ttk.Button(self, text="开始", command=self.start_stop, style='info.TButton')self.start_button.pack(side=tk.LEFT, padx=5)# 重置按钮self.reset_button = ttk.Button(self, text="重置", command=self.reset, style='warning.TButton')self.reset_button.pack(side=tk.LEFT, padx=5)# 切换边框按钮self.toggle_button = ttk.Button(self, text="隐藏边框", command=self.toggle_border, style='success.TButton')self.toggle_button.pack(side=tk.LEFT, padx=5)def update_time(self):if self.running:elapsed_time = int(time.time() - self.start_time)hours, remainder = divmod(elapsed_time, 3600)minutes, seconds = divmod(remainder, 60)self.time_label.config(text=f"{hours:02}:{minutes:02}:{seconds:02}")self.after(1000, self.update_time)def start_stop(self):if not self.running:self.start_time = time.time() - (int(self.time_label.cget("text").split(":")[0]) * 3600 + int(self.time_label.cget("text").split(":")[1]) * 60 +int(self.time_label.cget("text").split(":")[2]))self.running = Trueself.start_button.config(text="停止", style='danger.TButton')self.update_time()else:self.running = Falseself.start_button.config(text="开始", style='info.TButton')def reset(self):self.running = Falseself.start_button.config(text="开始", style='info.TButton')self.time_label.config(text="00:00:00")def toggle_border(self):if self.decorated:self.overrideredirect(True)  # 隐藏边框self.wm_attributes("-topmost", True)  # 将窗口置顶self.toggle_button.config(text="显示边框", style='primary.TButton')else:self.overrideredirect(False)  # 显示边框self.wm_attributes("-topmost", False)  # 取消置顶self.toggle_button.config(text="隐藏边框", style='success.TButton')self.decorated = not self.decorated  # 切换状态if __name__ == "__main__":app = TimerApp()app.mainloop()

结论

通过使用 ttkbootstrap，我们成功地创建了一个外观现代且功能完善的计时器应用程序。这个项目展示了如何通过调整按钮样式和添加动画效果来提升用户体验。ttkbootstrap 提供了非常方便的接口来设计美观的 GUI，希望这篇笔记能为你提供一些启发，帮助你在自己的项目中实现更加高级的 UI 效果。

---

嗨，我是命运之光。如果你觉得我的分享有价值，不妨通过以下方式表达你的支持：👍 点赞来表达你的喜爱，📁 关注以获取我的最新消息，💬 评论与我交流你的见解。我会继续努力，为你带来更多精彩和实用的内容。

点击这里👉 ，获取最新动态，⚡️ 让信息传递更加迅速。