QtWidgets样式表教程（附代码）

Qt是一个跨平台的C++图形用户界面应用程序开发框架，广泛应用于桌面和嵌入式系统开发。Qt Widgets是其中一个重要的模块，提供了创建经典桌面风格应用程序的基础。Qt Widgets支持样式表（Style Sheets），使开发者可以通过类似于CSS的方式对界面进行美化和定制。本文将详细介绍Qt Widgets的样式表的使用方法和技巧。

结尾附完整的样式表测试Demo代码链接…

什么是Qt Widgets样式表

Qt Widgets的样式表（Style Sheet）类似于Web开发中的CSS，可以用于控制Qt应用程序中控件的外观。通过样式表，开发者可以统一管理控件的样式，简化代码，提升开发效率。

样式表的基本语法

Qt Widgets样式表的语法与CSS非常相似，主要包括选择器、属性和属性值。下面是一个基本示例：

QPushButton {
    background-color: #3498db;
    color: white;
    border-radius: 5px;
    padding: 5px 10px;
}

QPushButton:hover {
    background-color: #2980b9;
}

这个样式表为所有的QPushButton控件设置了背景颜色、文本颜色、圆角边框和内边距。当按钮被悬停时，背景颜色会发生变化。

选择器

Qt样式表中涉及的选择器介绍：

通用选择器（通配选择器）

语法

* {
	background-color: red;
}

示例效果

语法解释

匹配所有QWidget类的实例对象，包含QWidget直接实例的对象和由QWidget派生类实例的对象。

一般不会用该选择器进行处理，因为其匹配的对象太多，所有按钮、QListWidget、QTreeWidget、QTableWidget等等都会被匹配。

类型选择器

语法

QWidget {
	background-color: red;
}

示例效果

语法解释

匹配所有QWidget类实例化的对象，包含由QWidget派生类实例化的对象。

QWidget { … }
用QWidget的类型选择器和上面的通用选择器所达到的效果是一样的。

类选择器

语法

.QWidget {
	background-color: red;
}

示例效果

语法解释

匹配QWidget直接实例化的对象，由QWidget类的派生类实例化的对象是不会被匹配上的。

属性选择器

语法

QPushButton[checkable=false] {
	background-color: yellow;
}
QPushButton[checkable=true] {
	background-color: blue;
}

示例效果

语法解释

匹配QPushButton类，且checkable属性分别为true和false的实例对象。

ID选择器

语法

#child_window {
	background-color: red;
}

示例效果

语法解释

匹配ObjectName为child_window的实例对象。

后代选择器

语法

#ParentWidget QWidget {
	background-color: red;
}

示例效果

示例解释

匹配ObjectName为ParentWidget的窗口对象中，子对象（只要是ParentWidget的后代，无论层级）的类型为QWidget的对象。

子选择器

语法

#ParentWidget > QWidget {
	background-color: red;
}

示例效果

示例解释

在ObjectName为ParentWidget的窗口对象中，只匹配类型为QWidget的直接子对象，子对象的子对象是不会被匹配的。

后代选择器和子选择器的区别就是，后代选择器是匹配所有后代，不论层级，而子选择器是只匹配子对象这一层级。

伪元素（子控件）选择器

语法

QComboBox::drop-down {
	background-color: red;
}

示例效果

示例解释

匹配QComboBox控件的伪元素对象（特定的子对象）。

伪元素列举

伪状态选择器

语法

QPushButton:hover {
	background-color: yellow;
}

示例效果

示例解释

匹配伪状态（悬浮状态）的按钮对象。

伪状态列举

Demo演示

效果图

Demo说明

该Demo演示了常用控件的样式表使用方法。除了演示样式表外，该项目还包含了以下功能：

1. 无边框窗口组件
2. 自定义Icon字体库

链接

下面两个链接分别是github和gitee对应仓库的地址：
LeoLei8060_github
LeoLei8060_gitee