当前位置: 代码迷 >> QT开发 >> Tab Widget控件的标签栏和主背景怎么加载不同的样式
  详细解决方案

Tab Widget控件的标签栏和主背景怎么加载不同的样式

热度:466   发布时间:2016-04-25 03:17:22.0
Tab Widget控件的标签栏和主背景如何加载不同的样式?
现在我在Tab Widget的样式表中添加以下的样式:
QTabBar::tab {min-width:100px;color: white;background-color:qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 #eeeeee, stop: 1 gray);border: 2px solid;border-top-left-radius: 10px;border-top-right-radius: 10px;padding:5px;
}
QTabBar::tab:!selected {margin-top: 5px;} 
QTabBar::tab:selected {color: blue;};
变成下面的样式:


但我再加上另一句:
border-image: url(:/pic/箭头.png);
为整个控件区域贴图,之后就变成了下面那样:

很明显之前的标签样式没了,而且标签的背景也被覆盖了,请问一下如何让这两种样式互不影响?
------解决方案--------------------
QTabWidget::pane { /* The tab widget frame */
    border-top: 2px solid #C2C7CB;
    position: absolute;
    top: -0.5em;
    border-image: url(:/pic/箭头.png);
}

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 */
}

是否可行?
  相关解决方案