QSlider

[GrahamLa]

Hi
In my application I have a QSlider that has a styled handle
These are my settings

/* ONLY QSlider - BEGIN
* NOTE: The syntax ".ClassName" allow us to select ONLY the "QSlider" objects and not subclass objects
* (for example it will NOT select the "LeftRightSlider" objects)
*/
.QSlider,
Exercise--GUI--IosSlider,
Exercise--GUI--BookmarksSlider
{
    background-color: transparent;
/*    background-color: red;*/
    /*singleStep: 1;*/
}

Exercise--GUI--IosSlider
{
    qproperty-singleStepSize: 1;
}

.QSlider:horizontal,
Exercise--GUI--IosSlider:horizontal,
Exercise--GUI--BookmarksSlider:horizontal
{
    min-height: 30px;
    min-width: 150px; /*vf*/
}

.QSlider:vertical,
Exercise--GUI--IosSlider:vertical,
Exercise--GUI--BookmarksSlider:vertical
{
    min-width: 30px;
}

.QSlider::groove:horizontal,
.QSlider::groove:vertical,
Exercise--GUI--IosSlider::groove:horizontal,
Exercise--GUI--IosSlider::groove:vertical,
Exercise--GUI--BookmarksSlider::groove:horizontal,
Exercise--GUI--BookmarksSlider::groove:vertical
{
    /*border: 1px solid black;*/
    border-radius: 3px;
    border-bottom: 2px solid white;
    background-color: gray;
}

.QSlider::sub-page:horizontal,
.QSlider::sub-page:vertical,
Exercise--GUI--IosSlider::sub-page:horizontal,
Exercise--GUI--IosSlider::sub-page:vertical,
Exercise--GUI--BookmarksSlider::sub-page:horizontal,
Exercise--GUI--BookmarksSlider::sub-page:vertical
{
    /*border: 1px solid black;*/
    border: none;
    /*border-radius: 3px;*/
    border-bottom: 2px solid white;
}

.QSlider::handle:horizontal,
.QSlider::handle:vertical,
Exercise--GUI--IosSlider::handle:horizontal,
Exercise--GUI--IosSlider::handle:vertical,
Exercise--GUI--BookmarksSlider::handle:horizontal,
Exercise--GUI--BookmarksSlider::handle:vertical
{
    background-color: white;
    border: 1px solid transparent;
    border-radius: 2px;
}

.QSlider::add-page:horizontal,
.QSlider::add-page:vertical,
Exercise--GUI--IosSlider::add-page:horizontal,
Exercise--GUI--IosSlider::add-page:vertical,
Exercise--GUI--BookmarksSlider::add-page:horizontal,
Exercise--GUI--BookmarksSlider::add-page:vertical
{
    /*border: 1px solid black;*/
    border: none;
    border-radius: 3px;
    border-bottom: 2px solid white;
}

.QSlider::groove:horizontal,
Exercise--GUI--IosSlider::groove:horizontal,
Exercise--GUI--BookmarksSlider::groove:horizontal
{
    /*height: 10px;*/
    height: 12px;
}

.QSlider::handle:horizontal,
Exercise--GUI--IosSlider::handle:horizontal,
Exercise--GUI--BookmarksSlider::handle:horizontal
{
    width: 18px;
    margin: -3px 0px -3px 0px;
    position: relative;
    top: 6px;
}

.QSlider::groove:vertical,
Exercise--GUI--IosSlider::groove:vertical,
Exercise--GUI--BookmarksSlider::groove:vertical
{
    width: 10px;
}

.QSlider::handle:vertical,
Exercise--GUI--IosSlider::handle:vertical,
Exercise--GUI--BookmarksSlider::handle:vertical
{
    height: 20px;
    margin: -1px -8px -1px -8px; /* top right bottom left */
}

QSlider:horizontal[Short="true"]
{
    min-width: 150px;
    max-width: 150px;
}

QSlider:horizontal[Medium="true"]
{
    min-width: 250px;
    max-width: 250px;
}

QSlider:horizontal[Long="true"]
{
    min-width: 550px;
    max-width: 550px;
}
/* ONLY QSlider - END */

The problem is that when the slider is set to the end or being of the control the the groove is not completely filled or emptied. It looks as though it is filled to the center of the handle.

Is there way around this

Thanks

[SGaist]

Hi and welcome to devnet,

Depending on the effect you want, you should consider implementing a subclass of QAbstractSlider and to the painting yourself.