Reputation: 63
How do I increase the height of this slider's handle:
As shown here:
Is subclassing QAbstractSlider the only way?
Here is the stylesheet from my code:
QSlider::groove:horizontal {
border: 1px solid #999999;
height: 32px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */
background: qlineargradient(x1:0, y1:0, x2:0, y2:1,
stop:0 #B1B1B1, stop:1 #c4c4c4);
margin: 2px 0;
}
QSlider::handle:horizontal {
background: qlineargradient(x1:0, y1:0, x2:1, y2:1,
stop:0 #b4b4b4, stop:1 #8f8f8f);
border: 1px solid #5c5c5c;
width: 40px;
margin: -20px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
border-radius: 3px;
}
Upvotes: 6
Views: 12504
Reputation: 8399
Use this stylesheet:
.QSlider {
min-height: 68px;
max-height: 68px;
background: #5F4141;
}
.QSlider::groove:horizontal {
border: 1px solid #262626;
height: 5px;
background: #393939;
margin: 0 12px;
}
.QSlider::handle:horizontal {
background: #22B14C;
border: 5px solid #B5E61D;
width: 23px;
height: 100px;
margin: -24px -12px;
}
It will produce the following:
Please note the the height of the slider is made constant by setting both min-height
and max-height
to the same value.
Upvotes: 11
Reputation: 11513
I copied your exact code into a form in Qt Designer. The slider handle looks large enough.
However, when adding a layout, the whole slider's size isn't large enough to show the complete handle. I simply added this:
QSlider {
height: 80px;
}
And get this result:
Upvotes: 2