qt自定義控制元件樣式02-QSpinBox

一、QSpinBox

QSpinBox 用於整數的顯示和輸入，一般顯示十進位制數，也可以顯示二進位制、十六進位制的數，而且可以在顯示框中增加字首或字尾

二、qss樣式

QSpinBox
 {
padding-right: 15px; /* make room for the arrows */
border-image: url(:/images/frame.png) ;//設定可伸縮的圖片
border-width: 3;//設定邊界寬度
}
QSpinBox::up-button //QSpinBox的向上按鈕
{
subcontrol-origin: border;//subcontrol-origin指定原始矩形內子控制元件的對齊方式
subcontrol-position: top right; /* position at the top right corner */
width: 16px; 
border-image: url(:/images/spinup.png);
border-width: 1px;
}
QSpinBox::up-button:hover//滑鼠放在向上按鈕上的偽狀態
 {
    border-image: url(:/images/spinup_hover.png) ;
}
QSpinBox::up-button:pressed 
{
    border-image: url(:/images/spinup_pressed.png) ;
}
QSpinBox::up-arrow //向上箭頭
{
image: url(:/images/up_arrow.png);//圖片資源
width: 7px;
height: 7px;
}
QSpinBox::up-arrow:disabled, QSpinBox::up-arrow:off//當值達到最大的時候
 { /* off state when value is max */
    image: url(:/images/up_arrow_disabled.png);
}
QSpinBox::down-button //向下按鈕
{
subcontrol-origin: border;
subcontrol-position: bottom right; /* position at bottom right corner */
width: 16px;
border-image: url(:/images/spindown.png) 1;
border-width: 1px;//邊界寬度
border-top-width: 0;//邊界頂部寬度
}
QSpinBox::down-button:hover //子控制元件滑鼠在上面的偽狀態
{
    border-image: url(:/images/spindown_hover.png);
}
QSpinBox::down-button:pressed//滑鼠按下的狀態
 {
    border-image: url(:/images/spindown_pressed.png) 1;
}
QSpinBox::down-arrow //向下的箭頭
{
image: url(:/images/down_arrow.png);
width: 7px;
height: 7px;
}
QSpinBox::down-arrow:disabled,
QSpinBox::down-arrow:off    //當向下按到值最小的時候
 {
 /* off state when value in min */
image: url(:/images/down_arrow_disabled.png);
}