qt qss

QT皮肤(QSS)编程：

借用css 的灵感， Qt也支持Qt本身的css, 简称qss。同css 类似，qss的主要功能与最终目的都是能使界面的表现与界面的元素分离，即质与形的分离，就如同一我的能够在不一样的时候穿上不一样的衣服同样，css机制的引入，使得设计一种皮肤与界面控件分离的软件成为可能，应用程序也能像web界面那样随意地改变外观。

1、QSS语法

同css同样，他也有由一个selector与一个declaration组成，selector指定了是对哪个控件产生效果，而declaration才是真正的产生做用的语句。如：
QPushButton { color: red }
QPushButton指定了是对全部的QPushButton或是其子类控件（如用户定义的MyPushButton）产生影响，而color:red代表全部的受影响控件的前景色都为red。
除了“类名”，“对象名”，“Qt属性名”这三样东西是大小写敏感的外其余的东西都是大小写不敏感的，如color与Color表明同一属性。
若是有几个selector指定了相同的declaration, 可使用逗号（,）将各个选择器分开，如：
QPushButton, QLineEdit, QComboBox { color: red }
他至关于：
QPushButton { color: red }
QLineEdit { color: red }
QComboBox { color: red }
declaration部份是一系列的（属性：值）对，使用分号（;）将各个不一样的属性值对分开，使用大括号（{}）将全部declaration包含在一块儿。

一、 通常选择器（selector）

Qt支持全部的CSS2定义的选择器，其祥细内容能够在w3c的网站上查找http://www.w3.org/TR/CSS2/selector.html ， 其中比较经常使用的selector类型有：

• 通用类型选择器：* 会对全部控件有效果。
• 类型选择器：QPushButton匹配全部QPushButton的实例和其子类的实例。
• 属性选择器：QPushButton[flat=”false”]匹配全部QPushButton属性flat为false的实例，属性分为两种，静态的和动态的，静态属性能够经过Q_PROPERTY() 来指定，来动态属性可使用setProperty来指定，如：
  QLineEdit *nameEdit = new QLineEdit(this);
  nameEdit->setProperty("mandatoryField", true);
  若是在设置了qss后Qt属性改变了，须要从新设置qss来使其生效，可使用先unset再set qss。
• 我本身实现的一种方式(可行)：

pushButton_ok->setEnabled(true);

QString buttonStyleSheet = pushButton_ok->styleSheet();

pushButton_ok->setStyleSheet("");

pushButton_ok->setStyleSheet(buttonStyleSheet);

• 类选择器：.QPushButton匹配全部QPushButton的实例，但不包含其子类，这至关于：*[class~="QPushButton"]     ~=的意思是测试一个QStringList类型的属性是否包含给定的QString
• ID选择器：QPushButton#okButton对应Qt里面的object name设置，使用这条CSS以前要先设置对应控件的object name为okButton，如：Ok->setObjectName(tr(“okButton”));
• 后裔选择器：QDialog QPushButton匹配全部为QDialog后裔（包含儿子，与儿子的儿子的递归）为QPushButton的实例
• 子选择器：QDialog > QPushButton匹配全部的QDialog直接子类QPushButton的实例，不包含儿子的儿子的递归。

二、子控件选择器

• 对于复杂的控件，可能会在其中包含其余子控件，如一个QComboxBox中有一个drop-down的按钮。那么如今若是要设置QComboxBox的下拉按钮的话，就能够这样访问：
  QComboBox::drop-down { image: url(dropdown.png) }其标志是（::）
• 子控件选择器是用位置的引用来表明一个元素，这个元素能够是一个单一控件或是另外一个包含子控件的复合控件。使用subcontrol-origin属性能够改变子控件的默认放置位置，如：
  QComboBox {
         margin-right: 20px;
  }
  QComboBox::drop-down {
         subcontrol-origin: margin;
  }
  
  如上语句能够用来改变drop-down的margin。
• 相对位置属性能够用来改变子控件相对于最初位置的偏移量，如当一个QCombox的drop-down按钮被按下时，咱们能够用一个内部的小偏移量来表示被按下的效果，以下：
  QComboBox::down-arrow {
         image: url(down_arrow.png);
  }
  QComboBox::down-arrow:pressed {
         position: relative;
         top: 1px; left: 1px;
  }
• 绝对位置属性容许子控件改变本身的位置和大小而不受引用元素的控件。一但位置被设定了，这些子控件就能够被当成通常的widget来对待，而且可使用合模型。关于合模型能够参考下面。

若是你要查看Qt支持哪些子控件选择器，能够参考：http://pepper.troll.no/s60prereleases/doc/stylesheet-reference.html#list-of-sub-controls-syntax.html
三、伪选择器（pseudo-states）

• 伪选择器以冒号（:）表示，与css里的伪选择器类似，是基于控件的一些基本状态来限定程序的规则，如hover规则表示鼠标通过控件时的状态，而press表示按下按钮时的状态。如：
  QPushButton:hover {
         Background-color:red;
  }
  表示鼠标通过时QPushButton背景变红。
• Pseudo还支持否认符号(!)，如：
  QRadioButton:!hover { color: red }
  表示没有鼠标移上QRadioButton时他显示的颜色是red。
• Pseudo能够被串连在一块儿，好比：
  QPushButton:hover:!pressed { color: blue; }
  表示QPushButton在鼠标移上却没有点击时显示blue字，但若是点击的时候就不会显示blue颜色了。
• 一样能够和以前所讲的子控件选择器一块儿联合使用，如：
  QSpinBox::down-button:hover { image: url(btn-combobox-press.bmp) }
• 与前面所讲的同样，伪选择器，子控件选择器等都是能够用逗号(,)分隔表示连续相同的设置的，如：
  QPushButton:hover,QSpinBox::down-button, QCheckBox:checked { color: white ;image: url(btn-combobox-press.bmp);} 表示以下
• 更多请参考：http://pepper.troll.no/s60prereleases/doc/stylesheet-reference.html#list-of-pseudo-states

2、 解决冲突

• 使用object name
  
  • 在程序里面要先设置控件的，如：
    btnOne = new QPushButton(centralWidget);
    btnOne->setObjectName(QString::fromUtf8("btnOneCh"));
  • 这样，咱们有了一个object name为btnOneCh的QPushButton，试验一下，使用指定object name的方式，如：
    QPushButton#btnOneCh { color: red }
    QPushButton { color: white }
    能够看出，btnOncCh的color变成了red
• 使用伪选择器，如hover，press，enabled等，如：按扭“1”是disable了的，QPushButton:!enabled {color: white}
• 全部的类型选择器都有一个共同的特性，就是若是有两个属性冲突了的话就会以最后出现的一个为准,如：
  QPushButton { color: red }
  QAbstractButton { color: gray }
  因为QPushButton为QAbstractButton的子类，若是只设置QAbstractButton的能够想像结果是全部的QPushButton都为gray, 若是只设置QPushButton的全部QPushButton都会为red，当两个都能设置起效的时候，以在文本上最后出现的为准，因此结果为Grey
• 固然其中若是有#指定了object name，他所设置的优先级是最大的，具体规则能够参考：http://www.w3.org/TR/CSS2/cascade.html#specificity，或是http://pepper.troll.no/s60prereleases/doc/stylesheet-syntax.html#conflict-resolution 
  QPushButton#btnOneCh { color: red }
  QPushButton { color: blue }
  QAbstractButton { color: gray }
  虽然QAbstractButton在最后，可是以前有#btnOneCh指定了QPushButton“一”的color为red因此最后显示也是“一”为red。

3、级联效应

• 子类能够继承父类的StyleSheet，可是若是子类里面设置了StyleSheet与父类里在设置的有冲突，那么固然会优先考虑子类本身的，
  一样，若是在qApp时面设置了，可是在某一个特定控件里面也设置，若是有冲突，也是优先控件本身的，例如，我在程序时面设置了：btnOneEn->setStyleSheet("QPushButton { color: red }");
  而，当我再设置qApp时，若是，将QPushButton的color设置成grey的，那么结果是对于btnOneEn这个QPushButton来讲他的颜色仍是red。
  这就是为何这里设置为grey了btnOneEn却仍是red的。
• 若是咱们对一个控件设置StyleSheet为：
  QPushButton* myPushButton;
  myPushButton->setStyleSheet("* { color: blue }");
  其实他和设置为：myPushButton->setStyleSheet("color: blue");
  效果相同，只是后一种设置不会对QPushButton的子类产生做用，但第一种却会。

4、继承性

与CSS不一样的一点，在CSS box模型中，若是一个元素在别一元素的里面，那么里面的元素会自动继承外面元素的属性，但QSS里面不会，如：
一个QPushButton若是放在一个QGroupBox里面，若是：qApp->setStyleSheet("QGroupBox { color: red; } ");
并不表明在QGroupBox里面的QPushButton也会有color:red的属性，若是要想有的话要显示写明，如：qApp->setStyleSheet("QGroupBox, QGroupBox * { color: red; }");
或者在应用程序里面也能够用QWidget::setFont等来设置到子控件的属性。

5、Namespace冲突

类型选择器可以使用到一个特定的类型，如：
class MyPushButton : public QPushButton {
      // ...
}
qApp->setStyleSheet("MyPushButton { background: yellow; }");

由于QSS使用QObject::className来判断要赋与style sheet的控件类型，若是一个用户定义控件类型在一个namespace里面的话，QObject::className会返回:: 的名字，这和子控件选择器的语法相冲突，为了解决此问题，使用“--”来代替“::”，好比：
namespace ns {
      class MyPushButton : public QPushButton {
          // ...
      }
}
qApp->setSytleSheet("ns--MyPushButton { background: yellow; }");

6、设置对像属性

若是在程序里面使用Q_PROPERTY设置的属性，能够在qss里面使用：qproperty-的形式来访问并设置值。如：
MyLabel { qproperty-pixmap: url(pixmap.png); }
MyGroupBox { qproperty-titleColor: rgb(100, 200, 100); }
QPushButton { qproperty-iconSize: 20px 20px; }
若是属性引用到的是一个由Q_ENUMS申明的enum 时，要引用其属性名字要用定义的名称而不是数字。
引用：http://pepper.troll.no/s60prereleases/doc/stylesheet