Qt 样式表

//QSS在线文档
http://doc.qt.io/qt-4.8/stylesheet-examples.html  
http://qtdebug.com/QSS-Subcontrol.html


1.样式规则的组成 
选择器{属性1:值1; 属性2:值2;...}
    
QPushButton{color:red}
QPushButton 选择器
{color:red} 声明
color 属性
red 值 


//多个选择器可以连接
QPushButton,QLineEdit,QComboBox{color:red}


//多条声明
QPushButton{color:red; background-color:white}

//qss中除类名，对象名，QT属性名以外区分大小写
//其它元素均不区分大小写


2.选择器
选择器 示例                           说明
通用选择器     *                             //匹配所有部件 
类型选择器     QPushButton                   //匹配所有QPushButton实例和它的所有子类
属性选择器     QPushButton[flat="false"]     //匹配QPushButton的flat属性值为false的实例
类选择器         QPushButton                   //匹配所有QPushButton实例，但不包含子类
ID选择器         QPushButton#okBtn             //匹配所有QPushButton中以okButton为ObjectName属性的实例,"okBtn"为objectName
子对象选择器     QDialog>QPushButton           //匹配所有QPushButton的实例，但它必须是QDialog的直接子类部件 
子孙对象选择器   QDialog QPushButton           //匹配所有QPushButton的实例，但它必须是QDialog的子孙部件 


选择器的组合：
//匹配所有objectName=="frame"的QFrame对象中
//objectName=="okBtn"并且x=="0",y=="0"的QPushButton对象
QFrame#frame>QPushButton[x="0"][y="0"]#okBtn


通过QObject::setProperty()添加属性
pSpinBox->setProperty("UserName", "Age");
*[UserName="Age"]{background-color: rgb(255, 0, 255);}


3.子控件(辅助控制器)
//改变所有QComboBox部件中的的下拉按钮样式
QComboBox::drop-down{image:url(dropdown.png)}  


辅助选择器 说明
::indicator 复选框，单选框，可选菜单项或可选群组框的指示器
::menu-indicator 按钮的菜单指示器
::item 菜单，菜单栏或状态栏项
::up-button 微调框或滚动条的向上按钮
::down-button 微调框或滚动条的向下按钮
::up-arrow 微调框、滚动条或标题视图的向上箭头
::down-arrow 微调框、滚动条或标题视图的向下箭头
::drop-down 组合框的下拉箭头(QComboBox右侧的箭头)
::title 群组框的标题QGrupBox


4.伪状态
//伪状态出现在选择器后面用 : 分隔
//当鼠标停留在QPushButton控件上时被应用
QPushButton:hover{color:white}


//伪状态可以使用 ! 表示否定
QRadioButton:!hover{color:red}


//伪状态连用
QPushButton:hover:checked{color:white} 


//使用 , 表示逻辑或操作
QCheckBox:hover,QCheckBox:checked{color:while}


状态 说明
:disable 禁用窗口部件 
:enabled 启用窗口部件 
:focus 窗口部件获取输入焦点
:hover 鼠标在窗口部件上悬停
:pressed 鼠标按键点击窗口部件 
:checked 按钮已被选中
:unchecked 按钮未被选中
:indeterminate 按钮被部分选中
:open 窗口部件位于打开或扩展状态
:closed 窗口部件位于关闭或销毁状态
:on 窗口部件状态是on
:off 窗口部件状态是off


5.样式冲突 
//当不同的样式对相同的属性指定了不同的值时，会产生冲突 
QPushButton#okButton{color:gray}
QPushButton{color:red}


//特殊的选择器优先(优先)

6.层叠
//样式表可以设置在QApplication/父部件/子部件上。
//部件的有效样式表是通过部件祖先的样式表和QApplication的样式表合并得到的
//当发生冲突时部件自己的样式表优先于任何继承的样式表
//父部件的样式表优先于祖先样式表

7.盒子模型
MARGIN
BORDER
PADDING
CONTENT


8.综合案例
QPushButton
{
    /*背景颜色*/
background-color:rgba(100,255,100,30);

    /*边框样式*/
    border-style:outset;

    /*边框宽度4px*/
    border-width:4px;

    /*边框圆角径*/
    border-radius:10px;

    /*边框颜色*/
    border-color:rgba(255,255,255,30);

    /*字体*/
    font:bold 14px;

    /*字体颜色*/
    color:rgba(0, 0, 0, 100);

    /*填衬*/
    padding:6px;
}

/*鼠标悬停*/
QPushButton:hover
{
background-color:rgba(100, 255, 100, 100);
    border-color:rgba(255, 255, 255, 200);
    color:rgba(0, 0, 0, 200);
}

/*按下*/
QPushButton:pressed
{
background-color:rgba(100, 255, 100, 200);
    border-color:rgba(255,255,255,30);
    border-style:inset;
    color:rgba(0, 0, 0, 100);
}

/*水平滑块的手柄*/
QSlider::handle:horizontal
{
image:url(:/sliderHandle.png);
}

/*滑块手柄滑过的地方*/
QSlider::sub-page:horizontal
{
/*边框图片*/
    border-image:url(:/slider.png);
}