码迷，mamicode.com
首页 > 其他好文 > 详细

QT自定义精美换肤界面

时间：2016-09-30 09:56:38      阅读：591      评论：0      收藏：0      [点我收藏+]

标签：

     Qt实际库里的自带组件的样式是系统标准的，要得到更好看的界面，光靠库里的样式是远远不够的，样式表的出现使得使用Qt做出更加漂亮的界面成为可能。

1. Qt样式表的动态加载：

代码如下：

QFile file(":/qss/stylesheet.qss");  
file.open(QFile::ReadOnly);  
QString styleSheet = QLatin1String(file.readAll());  
qApp->setStyleSheet(styleSheet);  
file.close();
        通过以上代码，可将Qt的样式表动态加载到一个.qss的样式表文件中，从而更加方便代码的调试。

2.QPushButton样式

技术分享

代码如下：

QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#DEB887;
	   
}

QPushButton#pushButton{
       background-color:#F08080;
       
}

QPushButton#pushButton_2{

       background-color:#FF8C00;
	   border-radius: 10px; 
}

QPushButton#pushButton_3{
     
       background-color:#4169E1;
}

QPushButton#pushButton_1{
       
       background-image: url(:qss/Skin/black/tools/tab-image.png);
       border-radius: 10px; 
	   border: 2px groove gray;
	   border-style: outset;
}

3.QListWidget样式

技术分享

代码如下：


QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#B8B8B8;
	   
}

QListWidget#listWidget{
      background:rgba(210,240,250,255);
	  color:#00CCFF;border:0px solid gray;
	  padding:0px -2px 5px 5px;}"  
                                 
      "QListWidget::item{width:94px;height:35px;border:0px solid gray;padding-left:8px;}
	  "QListWidget::item:!selected{}"  
	  "QListWidget::item:selected:active{background:#FFFFFF;color:#00CCFF;border-width:-1;}"  
	  "QListWidget::item:selected{background:#FFFFFF;color:#00CCFF;}"  
                                
	  }
    自选股1和自选股3是自定义状态，自选股2是选中状态。

4.QComboBox样式

技术分享

代码如下：

QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#B8B8B8;
	   
}

QComboBox#comboBox{
      color:#00CCFF;
	  border: 1px solid gray;
      border-radius: 3px;
	  height: 25px; 
	  padding: 1px 2px 1px 2px;  # 针对于组合框中的文本内容
	  subcontrol-origin: padding;
      subcontrol-position: top right;
      width: 20px;
      color:#00CCFF;
	  border:0px solid gray;
	  border:1px solid #d7d7d7; 
	  border-radius: 3px; 
	  padding: 1px 18px 1px 3px;   
	  QComboBox:editable{ background: white; };  
      QComboBox:!editable{ background: #fbfbfb; color:#666666};
      QComboBox::drop-down{ subcontrol-origin: padding;}; 
      subcontrol-position: top right;
      width: 22px; 
	  border-left-width: 1px;
      border-left-color: #c9c9c9;
      border-left-style: solid; /* just a single line */
      border-top-right-radius: 3px; /* same radius as the QComboBox */
      border-bottom-right-radius: 3px; 
	  
	  QComboBox::down-arrow { image: url(:/down.png);} ;
      QComboBox::down-arrow:on { /* shift the arrow when popup is open */ top: 1px; left: 1px;} ;
  	  QComboBox{font-size: 11px} ;
      QComboBox:!selected{color: red};
      QComboBox:selected:active{background-color: orange }; 
	  QComboBox:selected{color: orange}; 
}
5.QProgressBar样式

技术分享

代码如下：

QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#B8B8B8;
	   
}

QProgressBar#progressBar{
      border:none;
      background:#696969;
      border-radius:5px;
      text-align:center;
}

QProgressBar::chunk {

      background-color:rgb(58, 154, 255);
      border-radius:4px;
	 
}
6.QLineEdit样式

技术分享

技术分享

代码如下：

QLinlineEdit::lineEdit{
      enabled{color:#1964F};
	  disabled{color:orange};
	  border:1px solid gray;
	  border-radius:5px;
	  padding:0px 10px 0px 20px;
	  background:yellow;
	  selection-background-color: darkgary;
	  background-image:url(:qss/Skin/black/tools/edit.png);
}

7.QScrollBar样式

技术分享
代码如下：
QScrollBar#verticalScrollBar:vertical
{
    width:8px;
    background:rgba(0,0,0,0%);
    margin:0px,0px,0px,0px;
    padding-top:16px;   
    padding-bottom:16px;
}

QScrollBar#verticalScrollBar::handle:vertical
{
    width:8px;
    background:rgba(0,0,0,25%);
    border-radius:4px;   
    min-height:20;
}

QScrollBar#verticalScrollBar::handle:vertical:hover
{
    width:8px;
    background:rgba(0,0,0,50%); 
    border-radius:4px;
    min-height:20;
}

QScrollBar#verticalScrollBar::add-line:vertical   
{
    height:16px;width:16px;
    border-image:url(:qss/Skin/black/tools/appbar.menu.hover.png);
    subcontrol-position:bottom;
}
QScrollBar#verticalScrollBar::sub-line:vertical   
{
    height:16px;width:16px;
    border-image:url(:qss/Skin/black/tools/appbar.menu.put.hover.png);
    subcontrol-position:top;
}
QScrollBar#verticalScrollBar::add-line:vertical:hover   
{
    height:16px;width:16px;
    border-image:url(:qss/Skin/black/tools/appbar.menu.down.png);
    subcontrol-position:bottom;
}
QScrollBar#verticalScrollBar::sub-line:vertical:hover 
{
    height:16px;width:16px;
    border-image:url(:qss/Skin/black/tools/appbar.menu.put.down.png);
    subcontrol-position:top;
}

QScrollBar#verticalScrollBar::add-page:vertical,QScrollBar#verticalScrollBar::sub-page:vertical  
{
    border-style:solid;
    background:white;
    border-radius:4px;
}
8.QSlider样式

技术分享

技术分享

代码如下：

QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#0066CC;
	   
}

QSlider#horizontalSlider::groove:horizontal {  
border: 1px solid #4A708B;  
background: #orange;  
height: 5px;  
border-radius: 1px;  
padding-left:-1px;  
padding-right:-1px;  
}  
  
QSlider#horizontalSlider::sub-page:horizontal {  
background: qlineargradient(x1:0, y1:0, x2:0, y2:1,   
    stop:0 #B1B1B1, stop:1 #c4c4c4);  
background: qlineargradient(x1: 0, y1: 0.2, x2: 1, y2: 1,  
    stop: 0 #5DCCFF, stop: 1 #1874CD);  
border: 1px solid #4A708B;  
height: 10px;  
border-radius: 2px;  
}  
  
QSlider#horizontalSlider::add-page:horizontal {  
background: #575757;  
border: 0px solid #777;  
height: 10px;  
border-radius: 2px;  
}  
  
QSlider#horizontalSlider::handle:horizontal   
{  
    background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5,   
    stop:0.6 #45ADED, stop:0.778409 rgba(255, 255, 255, 255));  
  
    width: 11px;  
    margin-top: -3px;  
    margin-bottom: -3px;  
    border-radius: 5px;  
}  
  
QSlider#horizontalSlider::handle:horizontal:hover {  
    background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, stop:0.6 #2A8BDA,   
    stop:0.778409 rgba(255, 255, 255, 255));  
  
    width: 11px;  
    margin-top: -3px;  
    margin-bottom: -3px;  
    border-radius: 5px;  
}  
  
QSlider#horizontalSlider::sub-page:horizontal:disabled {  
background: #00009C;  
border-color: #999;  
}  
  
QSlider#horizontalSlider::add-page:horizontal:disabled {  
background: #eee;  
border-color: #999;  
}  
  
QSlider#horizontalSlider::handle:horizontal:disabled {  
background: #eee;  
border: 1px solid #aaa;  
border-radius: 4px;  
}

9.QTabWidget样式

美化前：

技术分享

美化后：

技术分享

代码如下：

QWidget#centralWidget{
       border-style:solid;
	   background: transparent;
	   background-color:#2F4F4F;
	   
}
QtableWidget#tableWidget:pane{
       background:  transparent; 
       background-color:#FFE4B5;

}
QTabBar::tab {
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
    border: 0.5px solid #C4C4C3;
    border-bottom-color: #C2C7CB;
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
    min-width: 8ex;
    padding: 2px;
	color:white;
}
 
QTabBar::tab:selected, QTabBar::tab:hover {
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                stop: 0 #fafafa, stop: 0.4 #f4f4f4,
                                stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
}

 QTabBar::tab:!selected {
    border-color: black;
	border-style:solid;
	background: transparent;
    border-bottom-color: red;
	background-image: url(:qss/Skin/black/tools/tab-image-pressed.png); 
}

 QTabBar::tab:selected {
    border-style:solid;
    border-color: black;
	background: transparent;
    border-bottom-color: red;
	background-image: url(:qss/Skin/black/tools/tab-image.png); 
}
如需要增加特殊背景，用如下方式：

代码如下：

QTabWidget#tab>QTabBar::tab:first 
{ 
border-image: url(:/Default_N.png); 
} 
QTabWidget#tab>QTabBar::tab:first:hover 
{ 
border-image: url(:/Default_P.png); 
} 
QTabWidget#tab>QTabBar::tab:first:pressed 
{ 
border-image: url(:/Default_P.png); 
} 
QTabWidget#tab>QTabBar::tab:last 
{ 
border-image: url(:/Apply_N.png); 
} 
QTabWidget#tab>QTabBar::tab:last:hover 
{ 
border-image: url(:/Apply_P.png); 
} 
QTabWidget#tab>QTabBar::tab:last:pressed 
{ 
border-image: url(:/Apply_P.png); 
}
10.其它使用细节总结：

    自定义的前台背景与后台背景的颜色：
 
如果需要样一个文本编辑器的背景变为黄色，  下面是代码行：
    qApp->setStyleSheet("QLineEdit { background-color: yellow }");
 
针对一个对话框的内容中使用 QLineEdit 以及 QLineEdit 的子类的背景都变成黄色，  下面是代码：
    
         myDialog->setStyleSheet("QLineEdit { background-color: yellow }");
 
如果只需要制定一个 QLineEdit 的内容，  将使用 QObject::setObjectName() 下面是一个实例：
  
        myDialog->setStyleSheet("QLineEdit#nameEdit { background-color: yellow }");
 
同时也可以针对每一个指定的部件做直接的类型设置，  下面是一个实例：
 
 nameEdit->setStyleSheet("background-color: yellow");
 
为了做一个鲜明的对比，  将要为文本设置合适的颜色。
 
 nameEdit->setStyleSheet("color: blue; background-color: yellow");
 
当然最好的办法还有针对选择的文本来进行设置，  下面设置了一个选择文本的类型属性：
 nameEdit->setStyleSheet("color: blue;"
                         "background-color: yellow;"
                         "selection-color: yellow;"
                         "selection-background-color: blue;");
 
 
   在有一些情况下，  不需要用户参与，  而有软件设计人员来自己制定样式，  即使这些是有违审美角度。   下面就从应用程序开发角度来设计样式。
 
*[mandatoryField="true"] { background-color: yellow }
上面的意思是一些强制的区域是需要用 Qt 的属性管理来强制设置成为黄色的背景。
这样一些强制的部件，将需要通过函数来设置当前的属性已经被强制设置，  下面是实现的代码：
 QLineEdit *nameEdit = new QLineEdit(this);
 nameEdit->setProperty("mandatoryField", true);
 
 QLineEdit *emailEdit = new QLineEdit(this);
 emailEdit->setProperty("mandatoryField", true);
 
 QSpinBox *ageSpinBox = new QSpinBox(this);
 ageSpinBox->setProperty("mandatoryField", true);

QPushButton：

下面我们将通过一个按钮的部件来设置属性样式：

  首先来设置一下样式：
     QPushButton#evilButton { background-color: red }
  说明设置的当前的按钮为红色。   作为一个 flat 平滑的按钮时没有边界的。  下面是来改进一下对边界的设置。
 
    QPushButton#evilButton {
     background-color: red;
     border-style: outset;
     border-width: 2px;
     border-color: beige;
 }
 
     在这里设置了一个边界的类型与边界的宽度。   这样看上去就好多了，文档中无法展现图片，  有兴趣可以去 Qt的变成环境当中去尝试。即使这样设计，  按钮看上去也是显得混乱，与主部件没有办法分开。  首先是在边界设置出一个空间出来，  并且强制的制定最小宽度，与环绕的弧度，  并且提供一个按钮的字体设置，  似的按钮看上去比较好看。
 
 QPushButton#evilButton {
     background-color: red;
     border-style: outset;
     border-width: 2px;
     border-radius: 10px;
     border-color: beige;
     font: bold 14px;
     min-width: 10em;
     padding: 6px;
 }
 
 
   如此这样当我们点击按钮的时候按钮也不会发生什么样的深刻变化。   所以就需要指定一个合适的背景颜色与不一样的边界类型。
 
 QPushButton#evilButton {
     background-color: red;
     border-style: outset;
     border-width: 2px;
     border-radius: 10px;
     border-color: beige;
     font: bold 14px;
     min-width: 10em;
     padding: 6px;
 }
 QPushButton#evilButton:pressed {
     background-color: rgb(224, 0, 0);
     border-style: inset;
 }
 
指定 QPushButton 菜单指示器的子控制
 
   子控提供了访问子子元素的功能，  例如通常的时候一个按钮将会管理一个菜单，
 QPushButton#evilButton::menu-indicator {
     image: url(myindicator.png);
 }
 
同时如果美化一个按钮的话，  那么将可以通过定位符来确定美化按钮的路径，  通常可以是一个图片。
 QPushButton::menu-indicator {
     image: url(myindicator.png);
     subcontrol-position: right center;
     subcontrol-origin: padding;
     left: -2px;
 }
 
  经过以上的设置那么 QPushButton 将会在方格的中心显示一个 myindicator.png 的图片。
 
定制按钮：
 
     QPushButton {
         border: 2px solid #8f8f91;
         border-radius: 6px;
         background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                           stop: 0 #f6f7fa, stop: 1 #dadbde);
         min-width: 80px;
     }
 
     QPushButton:pressed {
         background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                           stop: 0 #dadbde, stop: 1 #f6f7fa);
     }
 
     QPushButton:flat {
         border: none; /*  没有边框的按钮  */
     }
 
     QPushButton:default {
         border-color: navy; /* 使得按钮显示变得更加突出  */
     }
 
        QPushButton:open { /* when the button has its menu open */
         background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                           stop: 0 #dadbde, stop: 1 #f6f7fa);
     }
 
     QPushButton::menu-indicator {
         image: url(menu_indicator.png);
         subcontrol-origin: padding;
         subcontrol-position: bottom right;
     }
 
     QPushButton::menu-indicator:pressed, QPushButton::menu-indicator:open {
         position: relative;
         top: 2px; left: 2px; /* shift the arrow by 2 px */
     }
QSlider：

下面的横向的slider 

    QSlider::groove:horizontal {
         border: 1px solid #999999;
         height: 8px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */
         background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #B1B1B1, stop:1 #c4c4c4);
         margin: 2px 0;
     }
 
     QSlider::handle:horizontal {
         background: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0 #b4b4b4, stop:1 #8f8f8f);
         border: 1px solid #5c5c5c;
         width: 18px;
         margin: -2px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
         border-radius: 3px;
     }
 
 
       QSlider::groove:vertical {
         background: red;
         position: absolute; /* absolutely position 4px from the left and right of the widget. setting margins on the widget should work too... */
         left: 4px; right: 4px;
     }
 
     QSlider::handle:vertical {
         height: 10px;
         background: green;
         margin: 0 -4px; /* expand outside the groove */
     }
 
     QSlider::add-page:vertical {
         background: white;
     }
 
     QSlider::sub-page:vertical {
         background: pink;
     }
QSizeGrip：
一般讲通过一个图片进行设置  ：
     QSizeGrip {
         image: url(:/images/sizegrip.png);
         width: 16px;
         height: 16px;
     }
定制QSplitter：
QSplitter::handle {
         image: url(images/splitter.png);
     }
 
     QSplitter::handle:horizontal {
         height: 2px;
     }
 
     QSplitter::handle:vertical {
         width: 2px;
     }
QStatusBar：
将提供一个状态栏的边框与项目的定制：
  
    QStatusBar {
         background: brown;
     }
 
     QStatusBar::item {
         border: 1px solid red;
         border-radius: 3px;
     }
QTabWidget与QTabBar：
     QTabWidget::pane { /* The tab widget frame */
         border-top: 2px solid #C2C7CB;
     }
 QTabWidget::tab-bar { /* move to the right by 5px */
         left: 5px;        }
 
     /* Style the tab using the tab sub-control. Note that
         it reads QTabBar _not_ QTabWidget */
 QTabBar::tab {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                     stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
         border: 2px solid #C4C4C3;
         border-bottom-color: #C2C7CB;  /* same as the pane color */
         border-top-left-radius: 4px;
         border-top-right-radius: 4px;
         min-width: 8ex;
         padding: 2px;
     }
 QTabBar::tab:selected, QTabBar::tab:hover {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #fafafa, stop: 0.4 #f4f4f4,
                                     stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
     }
QTabBar::tab:selected {
         border-color: #9B9B9B;
         border-bottom-color: #C2C7CB;  /* same as pane color */
     }
QTabBar::tab:!selected {
         margin-top: 2px;  /* make non-selected tabs look smaller */
     }
QTabWidget::pane {  /* The tab widget frame */
         border-top: 2px solid #C2C7CB;
     }
QTabWidget::tab-bar {
         left: 5px;  /* move to the right by 5px */
     }
    /* Style the tab using the tab sub-control. Note that
         it reads QTabBar _not_ QTabWidget */
 QTabBar::tab {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                     stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
         border: 2px solid #C4C4C3;
         border-bottom-color: #C2C7CB;  /* same as the pane color */
         border-top-left-radius: 4px;
         border-top-right-radius: 4px;
         min-width: 8ex;
         padding: 2px;
     }
QTabBar::tab:selected, QTabBar::tab:hover {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #fafafa, stop: 0.4 #f4f4f4,
                                     stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
     }
QTabBar::tab:selected {
         border-color: #9B9B9B;
         border-bottom-color: #C2C7CB;  /* same as pane color */
     }
QTabBar::tab:!selected {
         margin-top: 2px;  /* make non-selected tabs look smaller */
     }

/* make use of negative margins for overlapping tabs */
 QTabBar::tab:selected {
         /* expand/overlap to the left and right by 4px */
         margin-left: -4px;
         margin-right: -4px;
     }
 
 QTabBar::tab:first:selected {
         margin-left: 0;  /* the first selected tab has nothing to overlap with on the left */
     }
QTabBar::tab:last:selected {
         margin-right: 0;  /* the last selected tab has nothing to overlap with on the right */
     }
QTabBar::tab:only-one {
         margin: 0;  /* 如果只有一个页面, 我们不能重叠边缘  */
     }
QTabWidget::pane { /* The tab widget frame */
         border-top: 2px solid #C2C7CB;
         position: absolute;
         top: -0.5em;
     }
QTabWidget::tab-bar {
         alignment: center;
     }
/* Style the tab using the tab sub-control. Note that
         it reads QTabBar _not_ QTabWidget */
 QTabBar::tab {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                     stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
         border: 2px solid #C4C4C3;
         border-bottom-color: #C2C7CB; /* same as the pane color */
         border-top-left-radius: 4px;
         border-top-right-radius: 4px;
         min-width: 8ex;
         padding: 2px;
     }
   QTabBar::tab:selected, QTabBar::tab:hover {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #fafafa, stop: 0.4 #f4f4f4,
                                     stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);
     }
   QTabBar::tab:selected {
         border-color: #9B9B9B;
         border-bottom-color: #C2C7CB; /* same as pane color */
     }
 
定制  QTableWidget：
  下面将设置 QTableWidget  的粉色选中区域，  与白色背景。
 QTableWidget {
         selection-background-color: qlineargradient(x1: 0, y1: 0, x2: 0.5, y2: 0.5,
                                     stop: 0 #FF92BB, stop: 1 white);
     }
QTableWidget QTableCornerButton::section {
         background: red;
         border: 2px outset red;
     }
QToolBox：
下面是对工具条的一些选项进行定制
 
          QToolBar {
         background: red;
         spacing: 3px; /* spacing between items in the tool bar */
     }
 
     QToolBar::handle {
         image: url(handle.png);  // 可以设置工具条的背景图片
     } 
 
 定制  QToolBox：
 
     将使用到  tab  的子控部分
 
            QToolBox::tab {
         background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                     stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                     stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
         border-radius: 5px;
         color: darkgray;
     }
 
     QToolBox::tab:selected { /* italicize selected tabs */
         font: italic;
         color: white;
     }
 定制 QToolButton：
 
     QToolButton { /* all types of tool button */
         border: 2px solid #8f8f91;
         border-radius: 6px;
         background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                           stop: 0 #f6f7fa, stop: 1 #dadbde);
     }
 
     QToolButton[popupMode="1"] { /* only for MenuButtonPopup */
         padding-right: 20px; /* make way for the popup button */
     }
 
     QToolButton:pressed {
         background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                           stop: 0 #dadbde, stop: 1 #f6f7fa);
     }
 
     /* the subcontrols below are used only in the MenuButtonPopup mode */
     QToolButton::menu-button {
         border: 2px solid gray;
         border-top-right-radius: 6px;
         border-bottom-right-radius: 6px;
         /* 16px width + 4px for border = 20px allocated above */
         width: 16px;
     }
 
     QToolButton::menu-arrow {
         image: url(downarrow.png);
     }
 
     QToolButton::menu-arrow:open {
         top: 1px; left: 1px; /* shift it a bit */
     }
QTreeView：
QTreeView::branch {
             background: palette(base);
     }
 
     QTreeView::branch:has-siblings:!adjoins-item {
             background: cyan;
     }
 
     QTreeView::branch:has-siblings:adjoins-item {
             background: red;
     }
 
     QTreeView::branch:!has-children:!has-siblings:adjoins-item {
             background: blue;
     }
 
     QTreeView::branch:closed:has-children:has-siblings {
             background: pink;
     }
 
     QTreeView::branch:has-children:!has-siblings:closed {
             background: gray;
     }
 
     QTreeView::branch:open:has-children:has-siblings {
             background: magenta;
     }
 
     QTreeView::branch:open:has-children:!has-siblings {
             background: green;
     }

QSS、CSS样式表属性参考表：

http://www.w3school.com.cn/css/css_background.asp


QT自定义精美换肤界面

标签：

原文地址：http://blog.csdn.net/fanyun_01/article/details/51920528
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！