Regarding verticle slider in Qml

Naveen_D

Hi all,
I am using slider in my project, i have customized the slider with groove and handle, as i know by default the slider orientation is Qt.Horizontal, but when i change it to Qt.Vertical i am not able to see the customized slider, only handle i am able to see and no groove
what changes i have to make in my code. i tried with changing the width and height of the groove but didn't get the output. but when i remove the groove part i am able to get the slider.

Here is my code:

import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

Window {
    visible: true
    width: 640
    height: 480

    Slider {
        id: theSlider

        property alias sliderWidth: theSlider.width
        property alias sliderValue: theSlider.value

        width:250
        maximumValue: 100
        minimumValue: 0
        value:0
        orientation: Qt.Vertical
        anchors.centerIn: parent
        updateValueWhileDragging : true
        style: SliderStyle {
            groove:  Rectangle {
                id: grooveMainrect
                height: 5
                antialiasing: true
                radius: 5
                color: "#847878"
                Rectangle {
                    id: groovechildrect
                    width: (parent.width * theSlider.value)/theSlider.maximumValue
                    height: parent.height
                    color: Qt.lighter("#7ea6d6", 1.2)
                    radius: parent.radius
                }
            }

            handle: Rectangle {
                id:handlemainrect
                height: (handlechildrect.height/3)+2
                width: (handlechildrect.width/3)+2
                radius: handlechildrect.width/2
                anchors.verticalCenter: parent.verticalCenter
                color: Qt.lighter("#7ea6d6", 1.2)
                Rectangle {
                    id: handlechildrect
                    width: 25
                    height: 25
                    anchors.centerIn: parent
                    color: "#000000"
                    radius: width/2
                    opacity: 0.5
                }
            }
        }
    }
}

p3c0

@Naveen_D Always provide width and height. You are missing height.

Naveen_D

@p3c0 Ya i got that..thanks. but my slider is not starting with the minimum value, by default the handle will be at the max value.

p3c0

@Naveen_D Hmm, something strange. If you give width and height to slider then its default value is set to maximum whereas if not given then it is set to minimum. Here are 2 cases:

//Works as expected
Item {
    width: 300
    height: 300

    Slider {
        orientation: Qt.Vertical
    }
}

//This doesn't
Item {
    width: 300
    height: 300

    Slider {
        width: 200
        height: 200
        orientation: Qt.Vertical
    }
}

Could this be a bug @jpnurmi ?

Naveen_D

@p3c0 One more thing, when i am increasing the value of the slider i am seeing decrease in the slider handle position, for example, i f i give slider value as 80, the actual slider handle will be appearing at 20. what is the mistake?