Darkn3ss
17th December 2010, 18:08
Hello, I am trying to customize a QScrollBar to be a particular height (75px) and have the handle be that height, but squish the groove down to 15px.
I have achieved the squish by adding margins, and then a -30px margin to the handle displays properly, but the only portion of the handle that is click-able is within the 15px section where the groove is located.
I have also tried the following code, figuring the a border of "solid transparent" would make the scrollbar look smaller, but not actually make the handle smaller.
The top picture is what I get, the bottom picture is what I want. The icon has been over-drawn to "protect" the IP of my company (they are anal about posting images, but not code).
5626
Has anyone already encountered a solution to this? I have scoured the internet for the last 2 days on this "style" request that our marketing department has.
Here is the CSS.
QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
background: none;
}
QScrollBar::sub-line:horizontal, QScrollBar::add-line:horizontal {
background: none;
}
QScrollBar::handle:horizontal {
image:url(C:/Filename.png);
min-height: 75px;
min-width: 125px;
}
QScrollBar:horizontal {
border: 30px solid transparent;
border-radius: 30px;
background: QLinearGradient(x1:0, y1:0, x2:1, y2:0, stop:0 rgba(0, 0, 0,255), stop:1 rgba(255, 255, 255,255));
}
I have achieved the squish by adding margins, and then a -30px margin to the handle displays properly, but the only portion of the handle that is click-able is within the 15px section where the groove is located.
I have also tried the following code, figuring the a border of "solid transparent" would make the scrollbar look smaller, but not actually make the handle smaller.
The top picture is what I get, the bottom picture is what I want. The icon has been over-drawn to "protect" the IP of my company (they are anal about posting images, but not code).
5626
Has anyone already encountered a solution to this? I have scoured the internet for the last 2 days on this "style" request that our marketing department has.
Here is the CSS.
QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
background: none;
}
QScrollBar::sub-line:horizontal, QScrollBar::add-line:horizontal {
background: none;
}
QScrollBar::handle:horizontal {
image:url(C:/Filename.png);
min-height: 75px;
min-width: 125px;
}
QScrollBar:horizontal {
border: 30px solid transparent;
border-radius: 30px;
background: QLinearGradient(x1:0, y1:0, x2:1, y2:0, stop:0 rgba(0, 0, 0,255), stop:1 rgba(255, 255, 255,255));
}