php除了写网站吗信贷网站开发

当前位置： 首页 > news >正文

php除了写网站吗,信贷网站开发,营销课程培训视频,高端人士什么是QSS QSS称为Qt Style Sheets也就是Qt样式表#xff0c;它是Qt提供的一种用来自定义控件外观的机制。QSS大量参考了CSS的内容#xff0c;只不过QSS的功能比CSS要弱很多#xff0c;体现在选择器要少#xff0c;可以使用的QSS属性也要少很多#xff0c;并且并不是所有…什么是QSS QSS称为Qt Style Sheets也就是Qt样式表它是Qt提供的一种用来自定义控件外观的机制。QSS大量参考了CSS的内容只不过QSS的功能比CSS要弱很多体现在选择器要少可以使用的QSS属性也要少很多并且并不是所有的属性都可以用在Qt的所有控件上。 QSS在Qt程序中的使用办法 首先将QSS写在文件中然后利用如下的代码设置QSS MainWidget::MainWidget(QWidget parent) :QWidget(parent),ui(new Ui::MainWidget) {//应用样式 apply the qss styleQFile file(:/qss/main.qss);file.open(QFile::ReadOnly);QTextStream filetext(file);QString stylesheet filetext.readAll();this-setStyleSheet(stylesheet);file.close(); }该段代码写在ui界面的后台cpp文件的构造函数中,主要是this-setStyleSheet()函数的设置功能要说明的是该函数除了可以对整个当前构造数所在的那个类所表示的ui进行整体应用样式以外setStyleSheet()函数本身是QWidget的成员函数几乎Qt中的大多数控件都可以直接使用该函数分别设置自己的样式。 QSS的语法规则 QSS的语法规则几乎与CSS相同。一条QSS的样式是由两部分组成的一部分是选择器指定了哪些控件会受到影响另一部分是指定了属性的值表示这些控件的哪些属性会受到影响。例如 QPushButton { color: red }QPushButton表示选择器指定了所有的QPushButton或者是QPushButton的子类会受到影响注意凡是继承自QPushButton的子类也会受到影响这是与CSS中不同的地方因为CSS应用的都是一些标签没有类的层次结构更加没有子类的概念。而后面的{color:red}则是规则的定义表明指定前景颜色是红色。整个意思就是设置QPushButton类以及其子类的所有实例的前景色是红色。 如果MyButton继承自QPushButton那么上面的规则也会应用到所有MyButton控件上但是如果规则是如下的 MyButton{color:red} 则只会对MyButton的实例应用红色的前景颜色而对QPushButton的实例没有应用。 QSS的选择器类型 1.通配选择器 ; 匹配所有的控件 2.类型选择器QPushButton ; 匹配所有QPushButton和其子类的实例 3.属性选择器QPushButton[flat“false”]; 匹配所有flat属性是false的QPushButton实例注意该属性可以是自定义的属性不一定非要是类本身具有的属性 4.类选择器 .QPushButton ; 匹配所有QPushButton的实例但是并不匹配其子类。这是与CSS中的类选择器不一样的地方注意前面有一个点号 5.ID选择器 #myButton; 匹配所有id为myButton的控件实例这里的id实际上就是objectName指定的值 6.后代选择器 QDialog QPushButton ; 所有QDialog容器中包含的QPushButton不管是直接的还是间接的 7.子选择器 QDialog QPushButton; 所有QDialog容器下面的QPushButton其中要求QPushButton的直接父容器是QDialog 另外上面所有的这些选择器可以联合使用并且支持一次设置多个选择器类型用逗号隔开这点与CSS一样例如#frameCut,#frameInterrupt,#frameJoin 表示所有这些id使用一个规则。#mytable QPushButton 表示选择所有id为mytable的容器下面的QPushButton实例 QSS子控件 QSS的子控件实际上也是选择器的一种因为这种选择器与CSS有一些不同所以单独拿出来说QSS的子控件选择器是应用在一些复合控件上的典型的例如QComboBox该控件的外观包含几个部分一般情况下有一个矩形的外边框右边有一个向下的箭头用于提示点击之后会有弹出下拉列表。例如 QComboBox::drop-down { image: url(dropdown.png) }上面的样式指定所有QComboBox的下拉箭头的图片为自定义的图片dropdown.png ::dropdown子控件选择器也可以与上面提到的选择器一起联合使用 QComboBox#myQComboBox::drop-down { image: url(dropdown.png) }指定id名为myQComboBox的QComboBox控件的下拉箭头的自定义图片要注意的是子控件选择器实际上是选择复合控件中的一部分也就是说对复合控件中的一部分应用样式例如为QComboBox的下拉箭头指定图片而不是为QComboBox本身指定图片。 QSS为很多复杂的复合控件提供了子控件的定义以方便对这些复合控件的各个部分进行样式设置。限于篇幅本文也不能将这些可用的子控件都列出来在安装QtCreator之后自带的帮助中就有很详细的描述。 QSS伪状态 QSS的伪状态选择器实际上与CSS中的类似是以冒号开头的一个选择表达式例如:hover表示当鼠标经过时候的状态。他限制了当控件在某一种状态下的时候才能应用QSS规则伪状态只能描述一个控件的状态或者是一个复合控件中的子控件的状态所以该伪状态选择器只能放在选择器的最后面例如 QComboBox:hover{background-color:red;}该规则表示当鼠标经过QComboBox上面的时候其背景颜色指定为红色该伪状态 :hover描述的是QComboBox的状态。 伪状态除了描述选择器选择的控件以外还可以描述子控件选择器所选择的复合控件中的子控件的状态例如 QComboBox::drop-down:hover{background-color:red;}表示当鼠标经过QComboBox的下拉箭头的时候该下拉箭头的背景颜色变成红色。 此外伪状态可以用一个感叹号表示否例如:hover表示鼠标经过而:!hover表示鼠标没有经过的状态。几个伪状态可以同时一起使用例如 QCheckBox:hover:checked { color: white }指定一个当鼠标经过一个选中的QCheckBox的时候设置其文字的前景颜色为白色。 QSS提供了很多的伪状态一些伪状态只能用在特定的控件上具体有哪些伪状态在Qt的帮助里面有详细的列表限于篇幅这里也不列出了。 QSS级联与冲突 QSS中的级联包含几个方面的概念一个是当在同一个控件上应用两个不同的规则那么应该应用哪一个规则的问题也就是如何解决这种冲突。二个是在一个容器控件上设置的QSS规则会对容器里面的控件产生效果(这要取决于容器控件上设置的QSS规则是什么样的规则如果容器控件上设置的QSS规则仅仅针对容器控件本身则该规则对子控件没有影响如果该QSS规则里面有对子控件的设置则自然会对子控件产生效果)级联问题是解决当一个控件被层层父容器包裹并且在每一层的父容器上都有对该控件的样式设置的时候该控件的最终效果是合并这些父容器上的QSS效果。 冲突问题 QPushButton#okButton { color: gray } QPushButton { color: red }这两条规则都会应用到名为okButton的按钮上但是他们为同一个属性设置了不同的颜色这会有冲突那么要解决这样的冲突就必须考虑到选择器的特异性(这个词怎么理解我理解为这个特异性为更加特殊实际上CSS上用权重表示这里的特异性)显然QPushButton#okButton仅仅针对对象名为okButton的控件有效果而QPushButton却对所有的QPushButton的实例或者是其子类的实例有效果显然QPushButton#okButton选择器更加特殊也就是更具有特异性。所以最终okButton前景色被应用为灰色。如果两条规则的特异性一样那么就选择放在后面的那一条。 另外如果一个选择器应用了伪状态而另一个没有那么应用了伪状态的选择器要更加特殊例如 QPushButton:hover { color: white } QPushButton { color: red }显然QPushButton:hover比单纯的QPushButton更加具有特异性。这两条规则表示当鼠标放在按钮上的时候文字是白色其他情况下都是红色。 如下面两个规则的特异性是一样的那么应该是如何应用呢 QPushButton:hover { color: white } //如果鼠标经过则前景白色 QPushButton:enabled { color: red } //如果按钮是enabled状态则前景红色所以默认情况下前景文字是红色的当鼠标经过的时候并不会变成白色因为他们的特异性是一样的所以选择后面的也就是红色。 那么换一下顺序会怎样呢 QPushButton:enabled { color: red } //如果按钮是enabled状态则前景红色 QPushButton:hover { color: white } //如果鼠标经过则前景白色当鼠标经过的时候就变成白色的了因为他们的特异性一样所以选择后面的规则也就是鼠标经过前景变成白色。 如果把其中的一条的特异性增加例如 QPushButton:hover:enabled { color: white } QPushButton:enabled { color: red }那么第一条的特异性比第二条大所以应用第一条的规则。 另外一种特异性发生在类型选择器上 QPushButton { color: red } //应用在所有的QPushButton上 QAbstractButton { color: gray } //应用在所有的QAbstractButton上而在类的继承结构上QAbstractButton是QPushButton的父类显然QPushButton更加具有特异性所以QPushButton的前景颜色被应用为红色而不是灰色。有没有一个办法来确定两条QSS规则的特异性大小呢其实QSS使用的特异性的计算方法与CSS是一样的详细可以参考CSS2的文档规范这里还是简要的说明一下特异性这个东西在CSS中一般被称为权重权重越大的越优先使用CSS的计算规则如下 1.计算一条规则中id选择器的个数假设存放在变量a中 2.计算一条规则中类选择器和属性选择器的个数存放在变量b中 3.计算一条规则中的类型选择器的个数存放在变量c中 4.忽略伪元素对应QSS中的子控件 下面是具体的计算方法

• {} /* a0 b0 c0 - specificity 0 / LI {} / a0 b0 c1 - specificity 1 / UL LI {} / a0 b0 c2 - specificity 2 / UL OLLI {} / a0 b0 c3 - specificity 3 */ H1 [RELup] {} / a0 b1 c1 - specificity 11 / UL OL LI.red {} / a0 b1 c3 - specificity 13 / LI.red.level {} / a0 b2 c1 - specificity 21 / #x34y {} / a1 b0 c0 - specificity 100 /上面的计算规则是CSS的计算规则同样可以应用的QSS上。 关于级联 QSS可以设置在QApplication上也可以设置在一个部件的容器部件上也可以设置在子孙部件上一个部件最终使用的样式效果是合并了他的所有父容器祖父容器等上面设置的所有样式的结果这些设置会进行叠加。如果在级联过程中发生了冲突例如部件本身指定的前景颜色为绿色而其父亲容器为其指定的前景颜色为红色此时就选择部件本身设置的样式效果。例如 qApplication-setStyleSheet(QPushButton { color: white }); myPushButton-setStyleSheet( { color: blue });第一条语句表示在QApplication上设置QPushButton的样式而第二条语句表示在myPushButton对象上设置样式。最终结果会将myPushButton的前景颜色设置为蓝色。级联效果主要应用在当一个控件的样式在多个容器控件上都有设置的时候该控件的最终效果是这些所有容器控件上效果的合并。级联规则在CSS中本身也是一个复杂的主题如果大家感兴趣还是需要自己参考CSS2的规范文档本节仅仅是抛装引玉。 另外一个要提到的是QSS中似乎为父容器控件本身设置的样式并不会被子控件继承例如如果QFrame中有一个QPushButton控件那么如下的语句 ui-frame-setStyleSheet(QFrame{ color: red; border:1px solid red });该语句仅仅为QFrame设置前景颜色以及边框的效果并不会应用到其里面的QPushButton上如果是下面的语句则都可以 ui-frame-setStyleSheet(QPushButton{ color: red; border:1px solid red }); ui-frame-setStyleSheet({ color: red; border:1px solid red });QSS实际应用中要注意的地方 在使用QSS的时候遇到过一些坑看似简单但是如果不知道的话还是很折磨人的 1使用QSS设置边框无效例如 border:1px solid red; //Ok border:solid 1px red; //Error border:red 1px solid; //Error border:red solid 1px; //Error设置边框颜色和像素的时候必须是第一种顺序而CSS中是无所谓的至于原因我也不清楚就是这么坑人。 2 QSS设置宽高无效 在QSS中设置宽高必须要使用 min-width和min-heightmax-widthmax-height来设置用width和height设置是没有任何效果的。 3QComboBox的样式设置的问题 QcomboBox是一个复杂的控件QComboBox由3部分组成一个是QComboBox的外框里面有一个下拉按钮这个按钮可以通过QComboBox::drop-down 来控制其位置将其定义到QComboBox的左边而不一定是右边。另外在这个下拉按钮上面一般会有一个向下的箭头这个箭头图像也是可以定制的通过QComboBox::down-arrow来指定箭头的图像。 如果要控制QComboBox的弹出下拉列表的样式需要通过 QComboBox QAbstractItemView {//设置当点击下拉按钮之后弹出的下拉列表的样式要注意的是这里的样式//仅仅只能设置弹出的整个下拉列表范围的矩形的样式不能设置下拉列表//中的每一个下拉项的样式例如不能设置每一个下拉项高度 } QcomboBox{//设置未弹出下拉列表的样式 }QComboBox QAbstractItemView::item { //设置弹出下拉列表中的每一个下拉项的样式这里的样式要想生效必须先 //对QcomboBox做下面的设置 //QStyledItemDelegate itemDelegate new QStyledItemDelegate(); //combox-setItemDelegate(itemDelegate);
  }