Стрелки QSpinBox помещают внешнюю линию редактирования (CSS) - PullRequest
Новая
       21

Стрелки QSpinBox помещают внешнюю линию редактирования (CSS)

2 голосов
/ 22 февраля 2012

изображение http://wiki.metrotek.spb.ru/mw/images/a/a9/Style-override.png

Как это сделать с помощью Qt CSS?

Я пытаюсь использовать 

subcontrol-origin: margin;
position: absolute;

но безуспешно.

Спасибо за любую помощь

Редактировать

Спасибо за помощь и окончательный CSS для моей проблемы: 

QSpinBox#spin {
margin-left: 20px;  /* make room for the arrows */
margin-right: 20px;  /* make room for the arrows */
width: 20px;

border: 2 solid #515151;
background-color: #434343;
}

QSpinBox#spin::up-button  {
subcontrol-origin: margin;
subcontrol-position: center left;

width: 19px;
border-width: 1px;
}

QSpinBox#spin::up-arrow  {
image: url(:/res/images/up.png);

min-width: 19px;
min-height: 14px;
max-width: 19px;
max-height: 14px;
height: 19px;
width: 14px;
}

QSpinBox#spin::up-button:pressed  {
top: 1px;
right: 1px;
}

QSpinBox#spin::down-button  {
subcontrol-origin: margin;
subcontrol-position: center right;
width: 19px;
border-width: 1px;
}

QSpinBox#spin::down-arrow  {
image: url(:/res/images/down.png);

min-width: 19px;
min-height: 14px;
max-width: 19px;
max-height: 14px;
height: 19px;
width: 14px;
}

QSpinBox#spin::down-button:pressed  {
top: 1px;
left: 1px;
}

и дополнительный CSS как бонус :) Если вы хотите установить положение для стрелок «вверх, вниз» за пределами редактирования только справа: 

QSpinBox#spin {
margin-right: 40px;  /* make room for the arrows */
width: 20px;

border: 2 solid #515151;
background-color: #434343;
}

QSpinBox#spin::up-button  {
subcontrol-origin: margin;
subcontrol-position: center right;
position: relative;

left: -20px;   /*   shift position back*/
width: 19px;
border-width: 1px;
}

QSpinBox#spin::down-button  {
subcontrol-origin: margin;
subcontrol-position: center right;
width: 19px;
border-width: 1px;
}

1 Ответ

2 голосов
/ 22 февраля 2012

Вы ознакомились с руководством по таблице стилей Qt?У них есть действительно конкретный пример того, как позиционировать ваши стрелки вверх и вниз:

вот ссылка 

QSpinBox {
     padding-right: 15px; /* make room for the arrows */
     border-image: url(:/images/frame.png) 4;
     border-width: 3;
 }

 QSpinBox::up-button {
     subcontrol-origin: border;
     subcontrol-position: top right; /* position at the top right corner */

     width: 16px; /* 16 + 2*1px border-width = 15px padding + 3px parent border */
     border-image: url(:/images/spinup.png) 1;
     border-width: 1px;
 }

 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, чтобы он также располагался слева.

...