QT|QTreeWidget样式qss


文章目录

  • QTreeWidget/QTreeView样式
  • QHeaderView
  • 背景属性
    • alternate-background-color:交替背景色
    • background:背景属性
    • background-color:控件的背景色
    • background-image:用于控件的背景图像。如果图像有透明部分则显示透明部分。
    • background-repeat:设置是如何重复背景图像
    • background-position:设置背景图像的位置
    • background-attachment:设置背景图像是否固定或者随着页面的其余部分滚动
    • background-clip:规定背景的绘制区域
    • background-origin:相对于内容框来定位背景图像

QTreeWidget/QTreeView样式 ::branch分支项
::item精确控制内容项
QTreeView::item { border: 2px solid green; border-top-color: red; border-bottom-color: black; background-color: blue; }

QT|QTreeWidget样式qss
文章图片

QTreeView::item { border: 1px solid #d9d9d9; border-top-color: transparent; border-bottom-color: transparent; }QTreeView::item:hover { background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #e7effd, stop: 1 #cbdaf1); border: 1px solid #bfcde4; }QTreeView::item:selected { border: 1px solid #567dbc; }QTreeView::item:selected:active{ background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6ea1f1, stop: 1 #567dbc); }QTreeView::item:selected:!active { background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6b9be8, stop: 1 #577fbf); }

QT|QTreeWidget样式qss
文章图片

QTreeView { show-decoration-selected: 1; }QTreeView::item { border: 1px solid #d9d9d9; border-top-color: transparent; border-bottom-color: transparent; }QTreeView::item:hover { background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #e7effd, stop: 1 #cbdaf1); border: 1px solid #bfcde4; }QTreeView::item:selected { border: 1px solid #567dbc; }QTreeView::item:selected:active{ background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6ea1f1, stop: 1 #567dbc); }QTreeView::item:selected:!active { background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #6b9be8, stop: 1 #577fbf); }QTreeView::branch { background: black; }QTreeView::branch:has-siblings:!adjoins-item { background: green; }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: yellow; }QTreeView::branch:has-children:!has-siblings:closed { background: gray; }QTreeView::branch:open:has-children:has-siblings { background: #87CEEB; }QTreeView::branch:open:has-children:!has-siblings { background: #008080; }/* 节点与兄弟节点之间的图标(在上的节点展开后) */ QTreeView::branch:has-siblings:!adjoins-item { border-image: url(vline.png) 0; }/*子项前面(非结束项)*/ QTreeView::branch:has-siblings:adjoins-item { border-image: url(branch-more.png) 0; }/*结束项*/ QTreeView::branch:!has-children:!has-siblings:adjoins-item { border-image: url(branch-end.png) 0; }/* 未打开节点时的图标 */ QTreeView::branch:has-children:!has-siblings:closed, QTreeView::branch:closed:has-children:has-siblings { border-image: none; image: url(branch-closed.png); }/* 打开节点时的图标 */ QTreeView::branch:open:has-children:!has-siblings, QTreeView::branch:open:has-children:has-siblings{ border-image: none; image: url(branch-open.png); }

QT|QTreeWidget样式qss
文章图片

QHeaderView 使用::section来控制样式,:该子控件拥有:middle,:fisrt,:last:only-one,:next-selected,:previous-selected,:selectted和checked状态。
QHeaderView::section { background-color: qlineargradient( x1:0, y1:0, x2:0, y2:1, stop:0 #616161, stop: 0.5 #505050, stop: 0.6 #434343, stop:1 #656565); color: white; padding-left: 4px; border: 1px solid #6c6c6c; } QHeaderView::section:checked { background-color: red; } /* 以下图标,只有在设置允许sortingEnable排序后,点击表头才会出现*/ QHeaderView::down-arrow { width:24px; height:24px; image: url(E:/arrow-down.jpg); } QHeaderView::up-arrow { width:24px; height:24px; image: url(E:/arrow-up.jpg); }

背景属性 alternate-background-color:交替背景色 用于修饰QAbstractItemView的子类
注意:先启用交替背景色属性
ui->tableWidget->setAlternatingRowColors(true);

QTableWidget{ alternate-background-color: blue; background: yellow; }

background:背景属性 【QT|QTreeWidget样式qss】支持 QAbstractItemView 子类, QAbstractSpinBox 子类, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip, and plain QWidgets.
background-color:控件的背景色 background-image:用于控件的背景图像。如果图像有透明部分则显示透明部分。 background-repeat:设置是如何重复背景图像 QT|QTreeWidget样式qss
文章图片

QMainWindow { background-image: url(://logo); background-repeat: repeat-x; }

background-position:设置背景图像的位置 有top、bottom 、 left 、 right 、 center五个值
QLabel { background-image: url(://logo); background-repeat: no-repeat; background-position: center; }

background-attachment:设置背景图像是否固定或者随着页面的其余部分滚动 scroll:默认值,背景图像会随着页面其余部分的滚动而滚动。
fixed:当页面的其余部分滚动时,背景图像不会移动。
background-clip:规定背景的绘制区域 QT|QTreeWidget样式qss
文章图片

有三个值border、padding、content
background-origin:相对于内容框来定位背景图像 有三个值border、padding、content

    推荐阅读