《qt入门-stylesheet样式表和2d绘》由会员分享，可在线阅读，更多相关《qt入门-stylesheet样式表和2d绘（26页珍藏版）》请在金锄头文库上搜索。
1、Qt入门 Style Sheet和2D绘图 Style Sheet样式表单 Qt的样式表单允许我们在对程序不做任何 代码上的更改的情况下轻松改变应用程序 的外观。 其思想来源于网页设计中的CSS（ Cascading Style Sheet），即可以将功能 设计和美学设计分开。 它的语法和概念和HTML CSS也是差不多 的。 基本语法 样式表单由一系列样式规则组成。每条规 则可以分成两部分：选择器和声明 QPushButton color: red 选择器表示规则作用到哪些控件上；声明 则详细说明了是什么规则。 这条规则让所有的按钮的字体都变成红 色。 选择器（selector）声明（dec
2、laration） 基本语法 Qt的样式表语法不区分大小写，所以color ，Color，coLor，coloR都表示同样的颜色 属性。 但是指代类的类名的时候，是区分大小写 的。 多个选择器可以并列使用，它们之间用逗 号隔开，例如： QPushButton, QLineEdit, QComboBox color: red 基本语法 声明部分也可以有多个并列，之间用分号 隔开。当我们要设置的选择器有多个属性 的时候，就需要并列多个声明，例如： QPushButton color: red; background-color: white 这条样式规则让按钮的字体变成红色，同 时背景色变成白色。
3、 选择器类别 Qt样式表单支持所有在CSS2中定义的选择 器类型，下面介绍几种最为常用的选择器 定义。 选择选择 器例子作用 全局选择器*选中所有的Widget 特定类型选择器QPushButton 选中所有 QPushButton以及它 派生出来的子类的对 象 属性选择器 QPushButtonflat=“false “ 选中所有flat属性为 false的按钮 选择器类别 属性选择器 可用于Qt中所有具有toString方法的属性，例如 QPushButton的text、checked等属性。 class属性略有特殊，它不代表一个类的具体属 性，它表示类名。 当属性是一个QStringLi
4、st时，可以用=这个符 号来匹配其中的某一项。 因为属性往往是动态的，当属性更改了的时候 ，需要调整样式表，通常做法是删除样式表， 再重新加载 选择器类别 选择选择 器例子作用 类选择 器.QPushButton 选中所有QPushButton的 对象，但不包括其子类 ID选择器QPushButton#okButton 选中所有object name是 okButton的QPushButton 对象 子控件选择器QDialog QPushButton 选中Qdialog上的所有 QPushButton子控件（直 接子控件，间接子控件） 嫡子控件选择器QDialog QPushButton 选中
5、所有Qdialog的直接 孩子QPushButton 精细控制 当控件相对比较复杂时，仅仅对其进行控 制是不够的，还需要能够对其子部件进行 控制，例如QComboBox的下拉点击按钮： QComboBox:drop-down image: url(dropdown.png) drop-down button 精细控制 width和height属性可以控制sub-control的 大小。当我们设置sub-control的图片时，也 间接设置了它的大小。 更多的sub-control可以参考Qt的帮助文档 中List of Sub-Controls部分。 注意，对于像QComboBox和QSpin
6、Box这 些控件，如果你设置了它的Sub-Control的 一个属性，那么其他所有的属性你都需要 设置，否则会看上去不太美观。 伪状态Pseudo-States 根据具体控件的状态不同，选择器也可以 有不同的状态，依次对应控件在不同状态 的现实效果，我们称之为伪状态pseudo- state。 伪状态和选择器类名之间，用一个冒号分 隔。例如： QPushButton:hover color: white 上面这条规则表示当鼠标悬停在按钮上时 ，其上文字显示为白色。 伪状态Pseudo-States 伪状态也可以反向选择，例如当我们要设 置除了鼠标悬停状态外其他所有状态的字 体颜色，则可以像下面
7、这样设置： QRadioButton:!hover color: red 同时，伪状态也可以并列，之间用冒号连 接，表示伪状态之间用AND计算： QCheckBox:hover:checked color: white QPushButton:hover:!pressed color: blue; 伪状态Pseudo-States 如果需要，伪状态之间可以用OR计算： QCheckBox:hover, QCheckBox:checked color: white 伪状态可以和我们之前讲的精细控制sub- control合起来使用： QComboBox:drop-down:hover image
8、: url(dropdown_bright.png) 冲突解决 在定义样式表的时候，会遇到定义冲突的 情况，例如： QPushButton#okButton color: gray QPushButton color: red 我们将object name是okButton的 QPushButton的字体颜色定义为灰色，但是 我们又将所有的QPushButton的字体颜色定 义为灰色，那okButton的颜色到底变成什么 了？ 冲突解决 这里我们引进选择器里的一个重要概念， 就是选择器的特化以及特化程度（ specificity） 在上一个例子中，第一条规则要比第二条 规则特化程度要高，因为第
9、二条规则适用 于所有的QPushButton，而第一条规则通常 只适用于一个QPushButton。 控件将首先应用特化程度高的规则，然后 再是特化程度较低的，以此类推。 冲突解决 当一个选择器中有伪状态修饰，则认为该 选择器也有相对较高的特化程度： QPushButton:hover color: white QPushButton color: red 上面的两条规则定义了一半的QPushButton 的字体颜色为红色，但是当鼠标悬停的时 候，字体颜色变为白色。 冲突解决 但是当特化程度一样的时候，冲突仍然存 在： QPushButton:hover color: white QPushB
10、utton:enabled color: red 当鼠标悬停在一个有效的按钮上的时候， 按钮颜色将变成什么？ 由于hover和enabled具有同样的特化程度 ，所以enabled将覆盖hover的设置，当鼠 标悬停在按钮上时，显示红色。 冲突解决 所以当我们需要设置有效的按钮在鼠标悬 停状态下的字体颜色，就需要将两条语句 位置互换： QPushButton:enabled color: red QPushButton:hover color: white 或者我们也可以使用并列特化的方式： QPushButton:hover:enabled color: white QPushButton:
11、enabled color: red 冲突解决 还有一种容易引起误解的情况： QPushButton color: red QAbstractButton color: gray QPushButton是QAbstractButton派生出来 的子类，是否第一条语句的特化程度比第 二条语句高？ 冲突解决 注意，Qt样式表定义中，类继承之间具有 一样的特化程度，所以上面的规则将所有 的QAbstractButton的字体设置为灰色，包 括QPushButton，因为QPushButton继承自 QAbstractButton。 我们可以调整上面两条语句的相对位置来 达到我们的设计目的。 特化程度
12、计算方法 选择器特化程度计算方法如下： 计算设置ID的个数（=a） 计算其他属性的个数（=b） 计算元素名字的个数（=c） 忽略精细控制语句（sub-control） 连接a-b-c三个数字，就是计算所得的特化程 度。 特化程度计算方法 选择选择 器特化程度计计算 * a=0 b=0 c=0 - specificity = 0 LI a=0 b=0 c=1 - specificity = 1 UL LI a=0 b=0 c=2 - specificity = 2 UL OL+LI a=0 b=0 c=3 - specificity = 3 H1 + *REL=upa=0 b=1 c=1 - s
13、pecificity = 11 UL OL LI.red a=0 b=1 c=3 - specificity = 13 LI.red.level a=0 b=2 c=1 - specificity = 21 #x34y a=1 b=0 c=0 - specificity = 100 样式层叠 Qt样式表单可以在Qapplication上设置，或 者在父窗口上设置，或者直接在子控件上 设置。最底层子控件的样式表是将所有其 祖先或者Qapplication的样式表单合并起来 ，作为其最终的样式表单。 当合并后冲突发生时，子控件自身的样式 表单总是要优先于其父类、祖类的样式表 单，父类的样式表单优于
14、祖类以此类 推。 样式层叠 例如，当我们通过QApplication设置全局样 式表单时，所有的QPushButton的字体都变 成白色： qApp-setStyleSheet( “QPushButton color: white “); 当我们再设置一个特定按钮的字体颜色时 ： myPushButton-setStyleSheet( “* color: blue “); 该样式将覆盖Qapplication对该按钮的设 定。 样式继承 在CSS中，子类的样式可以从父类中继承 下来，但是在Qt样式规则中，子QWidget是 不会从父QWidget中继承样式表的。 例如，架设一个QPushButton在 QGroupBox内，则我们在QApplication中设 置QGroupBox的样式表： qApp-setStyleSheet( “QGroupBox color: red; “); 样式继承 但是，在QGroupBox内的QPushButton并 不会继承QGroupBox的样式表。 如果我们需要设置QPushButton的样式表， 则需要显式地去设置它： qApp-setStyleSheet( “QGroupBox, QGroupBox * color: red; “);
