QScrollBar(滾動條)的一個完整樣式記錄
阿新 • • 發佈:2019-02-13
QScrollBar:vertical//首先是設定主體
{
margin:30px 0px 30px 0px;
background-color:#F0F1EF;
border: 0px;
width:30px;
}
QScrollBar::handle:vertical//滑塊
{
background-color:#bbbbbb;
width:30px;
border-radius:7px;//圓角
}
QScrollBar::handle:vertical:hover
{
background-color:#9B9B9B;
width :30px;
border-radius:7px;
}
QScrollBar::add-line:vertical//為滾動條下面的箭頭區域
{
subcontrol-origin: margin;
border:1px solid rgb(240,241,239);
height:30px;
}
QScrollBar::sub-line:vertical//為滾動條上面的箭頭區域
{
subcontrol-origin: margin;
border:1px solid rgb(240,241,239);
height:30px;
}
QScrollBar::add-page:vertical//表示未滑過的槽部分
{
background-color:rgb(240 ,241,239);
}
QScrollBar::sub-page:vertical //表示已滑過的槽部分
{
background-color:rgb(240,241,239);
}
QScrollBar::up-arrow:vertical//箭頭
{
border:0px;
width:30px;
height:30px;
border-image:url(":/Icons/up_Arrow.png");
}
QScrollBar::up-arrow:vertical:pressed
{
border:0px;
width:30px;
height:30px;
border-image:url(":/Icons/up_Arrow_down.png");
}
QScrollBar::down-arrow:vertical
{
border:0px;
width:30px;
height:30px;
border-image:url(":/Icons/down_Arrow.png");
}
QScrollBar::down-arrow:vertical:pressed
{
border:0px;
width:30px;
height:30px;
border-image:url(":/Icons/down_Arrow_down.png");
}
效果圖如下: