- 作者:老汪软件技巧
- 发表时间:2024-09-09 10:02
- 浏览量:
一. 前言
上一篇我们尝试了 PyQT6 的上手使用 ,这一篇来学习一下如何优化界面。
本文目标 :
二. 关于 PyQT 的 QSS2.1 QSS 简介2.2 QSS 常见用法一览
这里如果有一定的 CSS 基础 ,就可以跳过了 ,只是一个简单的 Demo :
QSS 里面最重要的就是三个环节 :
在写法上还有一些注意点:
一个标准用法 :
选择器 { /* 选择器表示这个样式针对什么对象生效 */
属性类型: 属性值;
}
/* 案例 */
QPushButton { /* 针对按钮 */
background-color: #4CAF50; /* 按钮背景颜色为绿色 */
color: white; /* 按钮文字颜色为白色 */
border-radius: 8px; /* 圆角半径为8像素 */
padding: 8px 16px; /* 内边距,上下8像素,左右16像素 */
font-size: 14px; /* 字体大小为14像素 */
}
互动行为
和 CSS 一样 ,QSS 也有 Hover 等互动行为可以使用 :
/* 当鼠标悬停在按钮上时,改变按钮的背景颜色 */
QPushButton:hover
/* 当按钮被按下时,改变按钮的背景颜色 */
QPushButton:pressed
/* 当输入框获得焦点时,改变边框颜色 */
QLineEdit:focus
一些常用的选择器和代码关系 :
// ID 选择器 : (没错 ,QT 组件也有 ID )
submit_button = QPushButton("Submit")
submit_button.setObjectName("submitButton") # 设置 objectName 以用于 ID 选择器
// 元素选择器
line_edit = QLineEdit()
QLineEdit {
border: 2px solid gray;
}
// 属性选择器
submit_button = QPushButton("Submit") submit_button.setProperty("customStyle", "green")
QPushButton[customStyle="green"] {
//......
}
// 最常见的类型选择器
QCheckBox {
font-size: 14px;
}
// 伪类选择器 :
QLabel:hover {
//........
}
// 组合选择器
QPushButton, QLabel {
font-size: 14px;
}
2.3 PyQT 如何使用 QSS
方式一 : 直接在代码里面注入 QSS 语法
// 在代码里面写 Style
self.setWindowTitle("QSS Example")
self.setGeometry(100, 100, 400, 300)
button = QPushButton("Click Me", self)
button.setGeometry(100, 100, 200, 50)
# 设置 QSS 样式
self.setStyleSheet("""
QMainWindow {
background-color: #f0f0f0;
}
QPushButton {
background-color: lightblue;
color: white;
border-radius: 10px;
padding: 10px;
}
QPushButton:hover {
background-color: darkblue;
}
""")
// 还可以直接给组件设置 Style
button.setStyleSheet("""
QPushButton {
background-color: lightgreen;
}
""")
❗但是这种写法我个人是不推荐的,代码混乱,不好打理
方式二 : 引入 QSS 文件
# 1. 先准备一个 QSS 文件 , 并且写入样式
-- 此处略
# 2. 引入 QSS 文件
stylesheet_path = os.path.join(os.path.dirname(__file__), 'layout.qss')
self.load_stylesheet(stylesheet_path)
def load_stylesheet(self, filename):
with open(filename, "r", encoding="utf-8") as file:
self.setStyleSheet(file.read())
三. 快速使用 Themes 套用模板
Github 上面有大量的主题样式可以开箱即用 ,这里列举几个 :
QDarkStyle 暗色主推库
pip install qdarkstyle
import qdarkstyle
// 也可以加载不同的样式 ,具体可以看官网
app = QApplication(sys.argv)
dark_stylesheet = qdarkstyle.load_stylesheet_pyqt6()
app.setStyleSheet(dark_stylesheet)
一些好用的主题推荐 :
…
总结
主要精力在做一个小工具上面 ,整体文章都以学习教程为主 。
内容不会太复杂 ,也是自己的学习路线 ,供大家参考
最后的最后 ❤️❤️❤️