PyQt笔记:QT/PyQt美化之QSS总结与参考资料汇总

本文详细介绍了Qt Style Sheets (QSS) 的核心概念,包括选择器类型、属性设置、子控件及伪状态等内容,帮助读者深入理解QSS的使用方法。

官方文档

参考资料

一、QSS选择器

选择器类型举例说明
通配选择器*匹配所有控件
类型选择器QPushButton匹配所有QPushButton和其子类的对象
属性选择器QPushButton[flat=“flase”]匹配所有属性flat的值为flase的QPushButton类型对象
类选择器.QPushButton匹配所有QPushButton的对象,但是不匹配其子类的对象
ID选择器#myBtn匹配所有ID为myBtn的控件对象,此ID为对象的objectName属性
后代选择器QDialog QPushButton所有QDialog容器中包含QPushButton类型的对象,不管直接或间接包含
子选择器QDialog > QPushButton所有QDialog容器下所有QPushButton对象,必须是直接包含

二、QSS属性设置

官方文档:

在QSS中设置的属性分为两种:

  • 样式表的属性, 如border、border-radius、background-color等属性
  • QObject系统的属性(QtDesigner中的属性/对象属性),如QLabel::alignment、QLabel::text、QLabel::wordWrap等属性,即在QObject框架中使用“Q_PROPERTY”申明的属性。

注:

  • 设置QOjbect属性时,需要在属性名前面加上"qproperty-"。比如要设置QLabel::alignment属性时在QSS中需要写成qproperty-alignment
  • 如果属性有多个值组成,需要将这个值用单引号和双引号括起来

以下是使用QSS属性和QObject属性的示例。

QLabel {
  border-radius: 3px;
  background-color: white;
  qproperty-alignment: AlignCenter; /*或者是 "AlignHCenter|AlignVCenter"*/
  qproperty-text:'This is a Text Mesage';
}

三、子控件(::)

官方文档:

  • 示例:下拉列表控件未展开状态下右侧的图标:QComboBox::drop-down { image: url(dropdown.png) }
  • 翻译版本:
Sub-ControlDescription
::add-line用于添加 QScrollBar 行的按钮。
::add-page控点(滑块)和 QScrollBar 的附加行之间的区域。
::branchQTreeView 的分支指标。
::chunkQProgressBar 的进度块。
::close-buttonQDockWidget 的关闭按钮或 QTabBar 的选项卡
::cornerQAbstractScrollArea 中两个滚动条之间的角
::down-arrowQComboBoxQHeaderView(排序指示器)、QScrollBarQSpinBox 的下拉箭头。
::down-buttonQScrollBarQSpinBox 的下拉按钮。
::drop-downQComboBox 的下拉按钮。
::float-buttonQDockWidget的浮动按钮
::grooveQS滑块的凹槽。
::indicatorQAbstractItemViewQCheckBoxQRadioButton、可检查 QMenu 项或可检查 QGroupBox 的指示器。
::handleQScrollBarQSplitter 或 QSlider 的手柄(滑块)。
::iconQAbstractItemViewQMenu 的图标。
::itemQAbstractItemViewQMenuBarQMenuQStatusBar 中的项。
::left-arrowQScrollBar 的左箭头。
::left-cornerQTabWidget 的左角。例如,此控件可用于控制 QTabWidget 中左角小部件的位置。
::menu-arrow带有菜单的 QToolButton 的箭头。
::menu-buttonQToolButton 的菜单按钮。
::menu-indicatorQPushButton 的菜单指示器。
::right-arrowQMenuQScrollBar 的右箭头。
::paneQTabWidget 的窗格(框架)。
::right-cornerQTabWidget 的右上角。例如,此控件可用于控制 QTabWidget 中右角小部件的位置。
::scrollerQMenuQTabBar 的滚动条。
::sectionQHeaderView 的一部分。
::separatorQMenuQMainWindow 中的分隔符。
::sub-line用于减去 QScrollBar 的一行的按钮。
::sub-page控点(滑块)和 QScrollBar 子行之间的区域。
::tabQTabBarQToolBox 的选项卡。
::tab-barQTabWidget 的选项卡栏。此子控件仅用于控制 QTabWidgetQTabBar 的位置。使用 ::tab 子控件设置选项卡的样式。
::tearQTabBar 的撕裂指示器。
::tearoffQMenu 的撕裂指示器。
::textQAbstractItemView 的文本。
::titleQGroupBoxQDockWidget 的标题。
::up-arrowQHeaderView(排序指示器)、QScrollBarQSpinBox 的向上箭头。
::up-buttonQSpinBox的向上按钮。

四、伪状态(:)

官方文档:

  • 翻译版本:
Pseudo-StateDescription
:active当微件驻留在活动窗口中时,将设置此状态。
:adjoins-itemQTreeView::分支与项目相邻时,将设置此状态。
:alternateQAbstractItemView::alternatingRowColors() 设置为 true 时,对于绘制 QAbstractItemView 行的每个交替行都设置此状态。
:bottom该项目位于底部。例如,其选项卡位于底部的 QTabBar
:checked该项目已选中。例如,QAbstractButton已检查状态。
:closable可以关闭这些项目。例如,QDockWidget 打开了 QDockWidget:😄 ockWidgetClosable 功能。
:closed项目处于关闭状态。例如,QTreeView 中的非展开项
:default该项目是默认项目。例如,默认 QPushButtonQMenu 中的默认操作。
:disabled该项目已禁用
:editableQComboBox是可编辑的。
:edit-focus该项目具有编辑焦点(请参阅 QStyle::State_HasEditFocus)。此状态仅适用于 Qt 扩展应用程序。
:enabled该项目已启用
:exclusive该项是独占项组的一部分。例如,独占 QAction 组中的菜单项。
:first该项目是第一个(在列表中)。例如,QTabBar 中的第一个选项卡。
:flat项目是扁平的。例如,一个扁平的 QPushButton
:floatable项目可以浮动。例如,QDockWidget 打开了 QDockWidget:😄 ockWidgetFloatable 功能。
:focus该项目具有输入焦点
:has-children该项目具有子项。例如,QTreeView 中具有子项的项目。
:has-siblings该项目具有同级。例如,QTreeView 中同级的项目。
:horizontal项目具有水平方向
:hover鼠标悬停在项目上。
:indeterminate项目具有不确定状态。例如,QCheckBoxQRadioButton 被部分选中
:last该项目是最后一个(在列表中)。例如,QTabBar 中的最后一个选项卡。
:left项目位于左侧。例如,其选项卡位于左侧的 QTabBar
:maximized项目将最大化。例如,最大化的 QMdiSubWindow
:middle项目位于中间(在列表中)。例如,不在 QTabBar 的开头或结尾的选项卡。
:minimized该项目将被最小化。例如,最小化的 QMdiSubWindow
:movable项目可以四处移动。例如,QDockWidget 打开了 QDockWidget:😄 ockWidgetMovable 功能。
:no-frame该项目没有框架。例如,无帧 QSpinBoxQLineEdit
:non-exclusive物料是非独占物料组的一部分。例如,非独占 QAction 组中的菜单项。
:off对于可以切换的项目,这适用于处于"关闭"状态的项目。
:on对于可以切换的项目,这适用于处于"打开"状态的小部件。
:only-one该项目是唯一的(在列表中)。例如,QTabBar 中的一个单独选项卡。
:open项目处于打开状态。例如,QTreeView 中的展开项,或者具有打开菜单的 QComboBoxQPushButton
:next-selected下一项(在列表中)处于选中状态。例如,QTabBar 的选定选项卡位于此项旁边。
:pressed正在使用鼠标按下项目。
:previous-selected上一项(在列表中)处于选中状态。例如,QTabBar 中所选选项卡旁边的选项卡。
:read-only该项目被标记为只读或不可编辑。例如,只读 QLineEdit 或不可编辑的 QComboBox
:right项目位于右侧。例如,其选项卡位于右侧的 QTabBar
:selected项目已被选中。例如,QTabBar 中的选定选项卡或 QMenu 中的选定项。
:top项目位于顶部。例如,其选项卡位于顶部的 QTabBar
:unchecked该项目处于未选中状态
:vertical项目具有垂直方向。
:window小部件是一个窗口(即顶级小部件)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

浅若清风cyf

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值