【Python】ttkbootstrap的介绍与使用

news2025/7/16 8:13:43

一、什么是ttkbootstrap?

官方文档 [较慢]:https://ttkbootstrap.readthedocs.io/en/latest/

ttkbootstrap 是一个基于 tkinter 的界面美化库,使用这个工具可以开发出类似前端 bootstrap 风格的 tkinter 桌面程序
图片

二、安装步骤

安装命令:pip install ttkbootstrap

三、开始使用

首先对它实例化创建应用程序窗口的一些简单介绍。

import ttkbootstrap as ttk
#实例化创建应用程序窗口,其实大部分命令与tkinter相似
root = ttk.Window(
        title="窗口名字",        #设置窗口的标题
        themename="litera",     #设置主题
        size=(1066,600),        #窗口的大小
        position=(100,100),     #窗口所在的位置
        minsize=(0,0),          #窗口的最小宽高
        maxsize=(1920,1080),    #窗口的最大宽高
        resizable=None,         #设置窗口是否可以更改大小
        alpha=1.0,              #设置窗口的透明度(0.0完全透明)
        )
# root.place_window_center()    #让显现出的窗口居中
# root.resizable(False,False)   #让窗口不可更改大小
# root.wm_attributes('-topmost', 1)#让窗口位置其它窗口之上
root.mainloop()

表签(Label)样式

图片

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Label(root,text="标签1",bootstyle=INFO).pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root,text="标签2",bootstyle="inverse").pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root,text="标签3",bootstyle="inverse-danger").pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root, text="标签4", bootstyle=WARNING, font=("微软雅黑", 15), background='#94a2a4').pack(side=LEFT, padx=5, pady=10)
root.mainloop()
'''
# bootstyle colors
PRIMARY = 'primary'
SECONDARY = 'secondary'
SUCCESS = 'success'
DANGER = 'danger'
WARNING = 'warning'
INFO = 'info'
LIGHT = 'light'
DARK = 'dark'

# bootstyle types
OUTLINE = 'outline'
LINK = 'link'
TOGGLE = 'toggle'
INVERSE = 'inverse'
STRIPED = 'striped'
TOOLBUTTON = 'toolbutton'
ROUND = 'round'
SQUARE = 'square'
'''

按钮(button)样式

图片

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Button(root, text="Button 1", bootstyle=SUCCESS).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 2", bootstyle=(INFO, OUTLINE)).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 3", bootstyle=(PRIMARY, "outline-toolbutton")).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 4", bootstyle="link").pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 5", bootstyle="success-link").pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 6", state="disabled").pack(side=LEFT, padx=5, pady=10) #在禁用状态下创建按钮
root.mainloop()

按钮点击
图片

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
#为按钮添加点击事件
#法一
def button1():
    print("Button1点击了一下!")
ttk.Button(root,text="Button1", bootstyle=(PRIMARY, "outline-toolbutton"),command=button1).pack(side=LEFT, padx=5, pady=10)
#法二
def button2(event): #这里要加一个参数,不然会报错
    print("Button2点击了一下!")
    button_text = event.widget["text"] #得到按钮上的文本
    print(button_text)
b = ttk.Button(root,text="Button2", bootstyle=(PRIMARY, "outline-toolbutton"))
b.pack(side=LEFT, padx=5, pady=10)
b.bind("<Button-1>", button2) #<Button-1>鼠标左键
root.mainloop()

输入框(Entry)样式

图片

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
e1 = ttk.Entry(root,show=None)
e1.insert('0',"默认插入内容")
e1.grid(row=5, column=1, sticky=ttk.W, padx=10,pady=10)
e2 = ttk.Entry(root,show="*",width=50,bootstyle=PRIMARY)
e2.grid(row=10, column=1, sticky=ttk.W, padx=10, pady=10)
e3_content = ttk.StringVar()
e3 = ttk.Entry(root,bootstyle='success', textvariable=e3_content).grid(row=15, column=1, sticky=ttk.W, padx=10, pady=10)
def get_entry_contetn():
    print("e1: ",e1.get())
    print("e2: ",e2.get())
    print("e3: ",e3_content.get())
ttk.Button(root,text="get_entry_contetn", bootstyle=(PRIMARY, "outline-toolbutton"),command=get_entry_contetn).grid(row=20, column=1, sticky=ttk.W, padx=10, pady=10)
root.mainloop()

文本框(Text)样式

图片

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
text = ttk.Text(root,)
text.pack(padx=10,pady=10,fill=BOTH)
text.insert('insert','text-content 1') #插入内容
text.delete("0.0",'end') #删除内容
text.insert('insert','text-content 2\npy')
text.see(ttk.END) #光标跟随着插入的内容移动
root.mainloop()

其余的都是tkinter不是特别常用或者tkinter.ttk官方教程里面有的

参考链接:Python GUI之tkinter的皮肤(ttkbootstrap)打造出你的窗口之美

四、总结时间

以上就是今天要讲的内容,本文仅仅简单介绍了ttkbootstrap的使用,而ttkbootstrap可以使我们创建一个简单用户图形界面,并对其可以做一些操作。

五、文章推荐

1.【Python】easygui的介绍与使用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/405543.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Vue项目安装less和less-loader

第一步&#xff1a;查看webpack和webpack-cli是否安装 打开cmd&#xff0c;通过命令查看 webpack -vwebpack-cli -v如果没有安装&#xff0c;要先进行安装 可以通过 npm view webpack version / npm view webpack-cli version 查看当前webpack的最新版本 可以通过 npm vie…

什么是axios(写给小白的理解笔记)

0.为什么会诞生axios 最初浏览器页面向服务器请求数据时&#xff0c;返回的是整个页面&#xff0c;整个页面都会刷新&#xff0c;当我们只需要请求部分数据时&#xff0c;返回整个页面会造成网络资源的占用&#xff0c;为了提高数据请求效率&#xff0c;异步网络请求Ajax出现了…

羊了个羊网页版

最近羊了个羊火的不得了&#xff0c;利用周末时间实现一个网页版。步骤如下&#xff1a; 1&#xff0c;用reactjs 实现。 2&#xff0c;实现Gameroom类。 3&#xff0c;实现Card类。 4&#xff0c;通过父组件控制子组件通信方式&#xff0c;控制点击事件。 5&#xff0c;通过t…

nvm切换node版本

在实际的前端开发过程中&#xff0c;可能会经常遇见 node.js 的版本问题&#xff0c;不同的项目需要使用不同的 node.js 版本。比如Vue2和Vue3需要的Node版本不一样。 地址&#xff1a;https://github.com/coreybutler/nvm-windows/releases 注意&#xff1a;安装之前必须完…

ChatGPT初体验——震撼,好用,贾维斯已来

2022.12.26 大概一个月的使用体验&#xff0c;我觉得chagpt的使用还算远远超出我的想象&#xff0c;可以说只有你想不到的&#xff0c;最近需要写一个基于shell的学生选课系统&#xff0c;但是时间实在是紧张的很&#xff0c;一开始chatgpt是无法接受这么大的要求的&#xff0c…

js实现数组去重的方式(7种)

目录JS数组去重的方式1.利用Set()Array.from()2.利用两层循环数组的splice方法3.利用数组的indexOf方法4.利用数组的includes方法5.利用数组的filter()indexOf()6.利用Map()7.利用对象JS数组去重的方式 例&#xff1a;将下面数组去除重复元素&#xff08;以多种数据类型为例&a…

vue开发中,数据更新,但视图不刷新

我们在开发过程中会碰到数据更新&#xff0c;但是视图并未改变的情况&#xff0c;情况如下&#xff1a; 第一种:动态给对象新增属性或者删除属性是不会触发视图刷新的,Vue识别不到&#xff1b; 第二种:通过数组下标修改数组中的元素或者手动修改数组的长度,Vue识别不到&#…

【Javaweb学习笔记】在Eclipse中创建Web项目

【Javaweb学习笔记】在Eclipse中创建Web项目 哈喽大家好&#xff0c;这里是Java框架学习笔记专栏第二期 本期内容——在Eclipse中创建Web项目 前期回顾&#xff1a; 第一期——schema约束 笔者还是菜菜&#xff0c;还请大家多多指教呀&#xff01; 文章目录【Javaweb学习笔记】…

解决onebot提示当前QQ版本过低,请升级到最新版在登录!

文章目录前言方法一方法二1️⃣下载文件2️⃣本地运行3️⃣重新启动go-cqHttp4️⃣服务器下载go-cqhttp5️⃣配置gocqhttp6️⃣启动go-cqhttp结语前言 &#x1f947;个人主页&#xff1a;MIKE笔记 &#x1f948;文章专栏&#xff1a;技术教程 &#x1f4e3;TG交流群&#xff1a…

vue:聊天对话框的实现

实现效果&#xff1a;不知道怎么录屏 就用图片展示了&#xff0c;实现了聊天框的基础功能&#xff0c;也有一些细节考虑不完全。未输入消息时可发送图片或视频&#xff0c;输入消息后显示发送按钮&#xff0c;保持滚动条在位于底部的最新消息。 实现方式&#xff1a; 1.布局&a…

React中的setState使用细节和原理解析

文章目录setState使用详解使用setState的原因setState的基本用法setState的异步更新setState获取异步结果setState一定是异步?setState使用详解 前面我们有使用过setState的基本使用, 接下来我们对setState使用进行详细的介绍 使用setState的原因 开发中我们并不能直接通过修…

vue项目打断点的三种方式

方式一&#xff1a;使用debugger介绍&#xff1a;js自带的方法优点&#xff1a;简单好用&#xff0c;不需要额外的配置注意&#xff1a;生产环境下需要去掉方式二&#xff1a;使用vsCode插件断点介绍&#xff1a;vscode集成的断点调试&#xff0c;大佬必备优点&#xff1a;减少…

Nodejs安装及npm配置(超详细)

文章目录一、Node.js 下载二、Node.js 安装node.js简单安装三、Node.js 配置配置npm源关于npm源的更新四、可能遇到的问题1. 直接输入npm 或 npm 命令出错一、Node.js 下载 Node.js官网下载地址 Node.js中文下载地址 本文以 node.js 16.14.2 版本做演示&#xff0c;此版本要…

vue如何请求后端数据

在vue中&#xff0c;我们如何通过请求接口来访问后端的数据呢&#xff1f;在这里简单总结了一个小示例&#xff1a; 主要问题&#xff1a;如果不封装的话&#xff0c;在每次请求的时候都要书写一遍下面的代码&#xff0c;造成代码冗余。 1、在src目录下创建一个utils文件夹&am…

uniapp h5跳转微信小程序(wx-open-launch-weapp)

目录 一、注意事项 二、使用步骤 三、调整样式 一、注意事项 微信版本要求为&#xff1a;7.0.12及以上系统版本要求为&#xff1a;iOS 10.3及以上、Android 5.0及以上已认证的服务号&#xff0c;服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。…

vue项目网页自适应,等比例放大缩小

同样是&#xff0c;虽然标题写的vue项目适用&#xff0c;但其它前端框架应该也可以。其它框架我没什么经验&#xff0c;可以参考着看看&#xff0c;应该适用。 本文章不涉及第三方插件&#xff0c;纯js。 自适应这个问题&#xff0c;老早以前就有一个解决方式&#xff0c;css中…

前端实现vue3使用axios调用后端接口

前言&#xff1a;在探索vue3.0的道路上调接口这件事很重要&#xff0c;所以我就把我探索出来的这条道展示出来&#xff0c;为大家提供便利&#xff0c;望喜欢&#xff0c;废话不多说展示&#xff01;&#xff01;&#xff01; 第一步&#xff1a;在src下创建一个http文件夹&am…

vue-devtools的安装与使用

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录前言一、vue-devtools是什么&#xff1f;二、vue-devtools安装1.下载vue-devtools工具2.安装vue-devtools工具三、vue-devtools的使用总结前言 主要介绍vue-devtool…

nvm详细安装步骤以及使用(window10系统)

nvm详细安装步骤以及使用 nvm是一个管理nodejs版本的工具。在实际的开发中&#xff0c;有些项目的开发依赖需要低版本的nodejs运行环境&#xff0c;此时我们就需要使用nvm来降低nodejs版本。 1.下载安装nvm&#xff0c;首先安装目录不要有空格和中文&#xff0c;会出现乱码 下…

若依框架详细使用

目录 &#x1f3f3;‍&#x1f308;若依是用来干什么的❓ &#x1f6a9;技术支持&#xff1a; &#x1f3f3;‍&#x1f308;如何下载❓ &#x1f6a9;官网地址: &#x1f3f3;‍&#x1f308;如何搭建ruoyi环境❓ &#x1f6a9;若依框架的目录结构 &#x1f6a9; 修改配…