QScrollBar設置滑塊滑槽箭頭增加減少按鈕的樣式設置


自己開發了一個股票智能分析軟件,功能很強大,需要的點擊下面的鏈接獲取:

https://www.cnblogs.com/bclshuai/p/11380657.html

1.標准完整的滾動條樣式

先來一個標准的設置,包括滑塊滑槽,箭頭,增加減少按鈕的設置。如下圖所示的垂直和水平滾動條設置。

 

 

/*垂直滾動條樣式*/
QScrollBar:vertical{
width:16px;
background: #FAFAFA;
border-radius:2px;
margin:16px 0px 16px 0px;
border-style:flat;
}
QScrollBar::handle:vertical{
background:#bbbbbb;
width:16px;
border: 1px solid #E5E5E5;
min-height:18px;
border-radius:2px;
border-style:flat;

}
QScrollBar::handle:vertical:normal{
background:#bbbbbb;
width:16px;
border: 1px solid #E5E5E5;
border-radius:2px;
border-style:flat;
}
QScrollBar::handle:vertical:hover{
background:#E6E6E6;
width:16px;
border: 1px solid #4C99F8;
border-radius:2px;
border-style:flat;
}
QScrollBar::handle:vertical:pressed{
background:#a5a5a5;
width:16px;
border: 1px solid #4C99F8;
border-radius:2px;
border-style:flat;
}
QScrollBar::add-line:vertical {
height: 16px;
subcontrol-origin:margin;
border-style:flat;
}
QScrollBar::sub-line:vertical {
height: 16px;
subcontrol-origin:margin;
border-style:flat;
}
QScrollBar::up-arrow:vertical{
subcontrol-origin: margin;
height:16px;
width:16px;
border:0 0 0 0;
border-style:flat;
border-image: url(:/DirectionArrow/image/DisplayImage/up-row.png);
}
QScrollBar::down-arrow:vertical{
subcontrol-origin: margin;
height:16px;
width:16px;
border-style:flat;
border-image: url(:/DirectionArrow/image/DisplayImage/down-row.png);
}
/*水平滾動條樣式*/
QScrollBar:horizontal
{
height:16px;
margin:0px,0px,0px,0px;
padding-left:16px;
padding-right:16px;
background: #FAFAFA;
}
QScrollBar::handle:horizontal
{
height:16px;
min-width:20;
background:#bbbbbb;
}
QScrollBar::handle:horizontal::disabled
{
background:#E6E6E6;
border: 1px solid #4C99F8;
}
QScrollBar::handle:horizontal:hover
{
background:#a5a5a5;
border: 1px solid #4C99F8;
}
QScrollBar::add-line:horizontal
{
width:16px;
subcontrol-position:right;
background-image: url(:/DirectionArrow/image/DisplayImage/right_row.png)
}
QScrollBar::sub-line:horizontal
{
width:16px;
subcontrol-position:left;
background-image: url(:/DirectionArrow/image/DisplayImage/left_row.png)
}
QScrollBar::up-arrow:horizontal
{
border-width:1px;
max-height:16px;
min-width:17px;
border-style:flat;
border-image: url(:/DirectionArrow/image/DisplayImage/right_row.png);
}
QScrollBar::down-arrow:horizontal
{
border-width:1px;
border-style:flat;
border-image: url(:/DirectionArrow/image/DisplayImage/left_row.png);
}

 

2.滑槽背景顏色設置-,讓滑槽和背景色融為一體

 

 

之前遇到一個問題,就是設置滑槽的背景顏色,對QScrollBar設置了一通,最后發現還是不行。去網上找到原來設置滑槽顏色

QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
background: #00304D;
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM