ttkbootstrap 学习

教程链接:ttkbootstrap学习 和 tkinter学习

本文章假设已经安装好了ttkbootstrap 第三方库，如果没有安装，可以访问官网。

编辑器: sublime text3
运行环境: IDLE 3.10

1. 创建一个应用程序

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window() # 创建窗口

# 添加控件
btn = ttk.Button(root,text="Button",bootstyle=SUCCESS)

# 将控件放入根容器中
btn.pack(padx=5,pady=10)

# 显示根容器
root.mainloop() 

运行截图:

1.1 控件属性说明

在各个控件基本参数：

属性	说明	取值
anchor	文本起始位置	CENTER(默认)，E,S,W,N,NE,SE,SW,NW
bg	背景色	无
bd	加粗（默认 2 像素）	无
bitmap	黑白二值图标	网上查找
cursor	鼠标悬停光标	网上查找
font	字体	无
fg	前景色	无
height	高（文本控件的单位为行，不是像素）	无
image	显示图像	无
justify	多行文本的对其方式	CENTER(默认)，LEFT,RIGHT,TOP,BOTTOM
padx	水平扩展像素	无
pady	垂直扩展像素	无
relief	3D浮雕样式	FLAT,RAISED,SUNKEN,GROOVE,RIDGE
state	控件实例状态是否可用	NORMAL(默认)，DISABLED
width	宽(文本控件的单位为行，不是像素)	无

Button 说明:

• Button(根容器,text=“标签文本”,bootstyle=常数,command=函数名)
• 利用匿名函数调用函数和传递参数。参数的表达式为“command=lambda”:函数名（参数列表）,如: command=lambda:func(a,b)
• Button按钮的状态有：'normal','active','disabled'

1.2 改变样式

通过bootstyle关键字可以修改样式。

样式种类共分为9种:

1. PRIMARY 主要
2. SECONDARY 次要
3. SUCCESS 成功
4. INFO 信息
5. WARNING 警告
6. DANGER 危险
7. LIGHT 浅色
8. DARK 暗色

通过 style.colors 获取所有样式

注意: ttk.Window.style.colors 它是window的一个API，可以在API文档找到

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window()

for color in root.style.colors:
    b = ttk.Button(root, text=color, bootstyle=color)
    b.pack(side=LEFT, padx=5, pady=5)

运行截图:

1.3 样式类型

bootstyle关键字很灵活,它可以控制显示的小部件的类型。

样式类型有2种：

1. solid 类型
2. outline 类型

合法类型:

• “info-outline” (推荐写法)
• “infooutline”
• “info outline”
• “outline-info”
• (“info”, “outline”)
• (INFO, OUTLINE) (推荐写法)

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window()

btn = ttk.Button(root,text="Button",bootstyle=(SUCCESS,OUTLINE))

1.4 主题样式

在创建窗口时,可以为Window()添加参数：

1. cosmo
2. flatly
3. litera
4. minty
5. lumen
6. sandstone
7. yeti
8. pulse
9. united
10. morph
11. journal
12. darkly
13. superhero
14. solar
15. cyborg
16. vapor
17. simplex
18. cerculean

如何使用?

ttk.Window(themename=“vapor”) 创建窗口时,指定窗口主题

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

# 在创建窗口时
root = ttk.Window(themename="vapor")

for color in root.style.colors:
    btn = ttk.Button(root,text=color,bootstyle=color)
    btn.pack(side=LEFT,padx=5,pady=5)

root.mainloop()

---

综合练习！如何在已创建窗口下，切换主题风格（建议学习tkinter）

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

# 定义函数，与组合框相互结合,当组合框选中一条时，切换选中的主题
def select_theme(event):
    ttk.Style(theme_select_combo.get())

# 在创建窗口时
root = ttk.Window(themename="vapor")

# 定义框架（将标签和组合框并列在一行）
frame1 = ttk.Frame(root)
frame1.pack()

label = ttk.Label(frame1,text="主题选择:",font=15)
label.pack(side=LEFT)

# 主题选择组合框
var = ttk.StringVar()
theme_select_combo = ttk.Combobox(frame1,textvariable=var,values=["cosmo","flatly","minty","vapor"],bootstyle=SUCCESS)
theme_select_combo.bind("<>", select_theme) # 绑定事件
theme_select_combo.pack(side=LEFT,padx=10,pady=5)

for color in root.style.colors:
    btn = ttk.Button(root,text=color,bootstyle=color)
    btn.pack(side=LEFT,padx=5,pady=5)

root.mainloop()

运行截图:

更多样式：参考官方文档

2. 按钮

2.1 创建按钮

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window()

# 按钮创建成功
ttk.Button(root).pack(padx=5,pady=5)

2.2 按钮样式

普通按钮(不包括复选按钮)样式总共有3种：

1. 实心按钮（默认）: solid
2. 外框按钮：outline

Button(text="Button",bootstyle=(OUTLINE))

3. 链接按钮：link

Button(text="Button",bootstyle=(LINK))

2.3 按钮状态

按钮三大状态:'normal','active','disabled'

如何禁用按钮？

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window()

b = ttk.Button(text="Button",bootstyle=(LINK))
b.pack()
b.configure(state="disabled")

2.4 复选按钮

2.4.1 默认样式

import ttkbootstrap as ttk
from ttkbootstrap.constants import *

root = ttk.Window()

for color in root.style.colors:
    btn = ttk.Checkbutton(root,text=color,bootstyle=color).pack(side=LEFT,padx=5,pady=5)

2.4.2 工具按钮

与上面类似，注意修改bootstyle部分

ttk.Checkbutton(root,text=color,bootstyle=(color,TOOLBUTTON))

激活时：默认颜色，非激活时：灰色

2.4.3 外框工具按钮

关闭 时为outline，启用 或 激活 时为solid背景

# 默认外框工具按钮样式
Checkbutton(bootstyle="outline-toolbutton")

# success外框工具按钮样式
Checkbutton(bootstyle="success-outline-toolbutton")

2.4.4 圆形切换按钮

关闭时，灰色状态，启用 或 激活时会恢复默认颜色

# 默认圆形切换样式
Checkbutton(bootstyle="round-toggle")

# success圆形切换样式
Checkbutton(bootstyle="success-round-toggle")

2.4.5 方形切换按钮

关闭时，灰色状态，启用 或 激活时会恢复默认颜色

# 默认方形切换样式
Checkbutton(bootstyle="square-toggle")

# success方形切换样式
Checkbutton(bootstyle="success-square-toggle")

…