QScrollBar 的css 設定詳解
阿新 • • 發佈:2019-02-02
本文主要介紹QScrollBar的樣式表設定的問題
setStyleSheet(QString::fromUtf8("\ QScrollBar::vertical {\ background:rgb(63,70,87);\ border:0px solid grey;\ width: 30px;\ margin:30px 0px 30px 0px;\ }\ QScrollBar::handle:vertical {\ background: rgb(108,113,125);\ border: 1px solid grey;\ border-radius:0px;\ min-height: 20px;\ width:30px;\ }\ QScrollBar::add-line:vertical {\ height: 30px;\ subcontrol-origin:margin;\ }\ QScrollBar::sub-line:vertical {\ height: 30px;\ subcontrol-origin:margin;\ }\ QScrollBar::up-arrow:vertical {\ subcontrol-origin: margin; \ height: 31px;\ border:0 0 0 0;\ border-image: url(:images/uparrow.png);\ }\ QScrollBar::down-arrow:vertical { \ subcontrol-origin: margin; \ height: 31px;\ border-image: url(:images/downarrow.png);\ }\ QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {\ background: none;\ border:0,0,0,0;\ }\ QScrollArea {\ border:0,0,0,0;\ background:rgb(63,70,87);\ }\ "));
1、 QScrollBar::vertical 設定縱向滾動條,水平的為horizon,預設的分別在下面和右邊。主要注意的是margin:30px 0px 30px 0px;一定要有,否則上下箭頭可能看不到了。
2、QScrollBar::handle:vertical 縱向滾動條中間滑動的控制代碼設定,min-height: 20px;這個表示最小高度
3、 QScrollBar::add-line 為滾動條下面的箭頭區域,點一下往下走一行的那個,sub-line則是上面的
height: 30px;\
subcontrol-origin:margin;\
必須的
4、 QScrollBar::up-arrow down-arrow上下箭頭,高度應稍大好看些
5、QScrollArea 就是滾動條上下箭頭之間區域的樣式設定