QSlider: changing the groove without changing the handle

[Olivier Berten]

Hi!

I wanted to modify the groove of a slider while keeping the original handler but it didn't seem to work...

If I just define the groove in the stylesheet, the groove looks as expected but the handle disappears...

Any hint?

[QbelcorT]

Hi,
It would be easier seeing a picture of what you are trying to do. I don't know if this helps or not but here is a stylesheet I used for my sliders ( I am using images for the groove and handle). Maybe it will give you some hints.

QSlider::groove:horizontal {border-image: url(icons:guage_cursor_bg1.png);
border-width: 1px; height: 31px;}
QSlider::handle:horizontal {margin-top:0px; margin-bottom:-1px;
image: url(icons:guage_cusor_n.png);

QSlider::groove:horizontal {border-image: url(icons:guage_cursor_bg1.png);
border-width: 1px; height: 31px;}
QSlider::handle:horizontal {margin-top:0px; margin-bottom:-1px;
image: url(icons:guage_cusor_n.png);

To copy to clipboard, switch view to plain text mode 

[Olivier Berten]

Well... Here is my code:

#!/usr/bin/env python
# coding: utf-8
from PyQt4.QtCore import *
from PyQt4.QtGui import *
import sys
 
app = QApplication(sys.argv)
 
style = """QSlider::groove:horizontal {
border: 1px solid #999999;
height: 8px; /* 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);
}
"""
 
slider = QSlider()
slider.setOrientation(Qt.Horizontal)
slider.setStyleSheet(style)
 
layout = QVBoxLayout()
layout.addWidget(slider)
 
widget = QWidget()
widget.setLayout(layout)
widget.show()
 
app.exec_()

#!/usr/bin/env python
# coding: utf-8
from PyQt4.QtCore import *
from PyQt4.QtGui import *
import sys

app = QApplication(sys.argv)

style = """QSlider::groove:horizontal {
border: 1px solid #999999;
height: 8px; /* 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);
}
"""

slider = QSlider()
slider.setOrientation(Qt.Horizontal)
slider.setStyleSheet(style)

layout = QVBoxLayout()
layout.addWidget(slider)

widget = QWidget()
widget.setLayout(layout)
widget.show()

app.exec_()

To copy to clipboard, switch view to plain text mode 

and here is the result
QSlider.png

[bisen]

For most widgets, when you set stylesheet for one component, you may have to define stylesheets for other components too.

Like the QSlider, QScrollBar etc.

Here, defining both the groove and the handle in the stylesheet caused it to work.