QT 滚动条样式

QScrollArea 样式美化：

说明：horizontal：水平滚动条，vertical：垂直滚动条，需要换为水平滚动条设置只需要将vertical替换为horizontal即可

整个垂直滚动条区域样式
QScrollBar:vertical{ }
滚动条上面和下面区域样式
QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical{ }
滑块区域样式
QScrollBar::handle:vertical{ }
鼠标滑过滑块样式
QScrollBar::handle:vertical:hover,QScrollBar::handle:vertical:pressed{ }
向上箭头样式
QScrollBar::sub-line:vertical{ }
向上箭头滑过、摁下样式
QScrollBar::sub-line:vertical:hover,QScrollBar::sub-line:vertical:pressed{ }
向下箭头样式
QScrollBar::add-line:vertical{ }
向下箭头滑过、摁下样式
QScrollBar::add-line:vertical:hover,QScrollBar::add-line:vertical:pressed{ }

 

QScrollArea{
border: 0px solid;
border-right-width: 1px;
border-right-color: #dcdbdc;
background-color: #f5f5f7;
}
QScrollBar:vertical {
border: none;
background: #f5f5f7;
width: 5px;
margin: 0px 0 0px 0;
}
QScrollBar::handle:vertical {
background: Gainsboro;
min-height: 20px;
border-radius: 2px;
border: none;
}
QScrollBar::add-line:vertical {
border: 0px solid grey;
background: #32CC99;
height: 0px;
subcontrol-position: bottom;
subcontrol-origin: margin;
}
QScrollBar::sub-line:vertical {
border: 0px solid grey;
background: #32CC99;
height: 0px;
subcontrol-position: top;
subcontrol-origin: margin;
}
QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
background: none;
width: 0px;
height: 0px;
}

转载 https://www.cnblogs.com/warm-home/p/12782388.html