QML Dial is weak or I miss something?

[Gourmet]

I need circular dialer like QDial or QML Dial but with some mandatory features:

• it must rotate clockwise increasing value
• it must be "closed" - it's end must connect to start
• it must have starting value in most top point
• it must have notches.

With QDial I have got almost all instead one important feature - I cannot make it's starting position on top. It always is on bottom. QWidget is not a revolvable thing... Do not suggest use QGraphicsScene for rotation - dialer must be part of other complex widget which must not be rotated. I tried QML Dial - it is revolvable as well. But I do not see ability "close" it and I do not see notches. Am I missing something in QML Dial? It looks very weak in comparison to QDial.

[Shrinidhi Upadhyaya]

Hi @Gourmet,

• For the clockwise rotation you need to write the logic inside onValueChanged signal,basically you need to change the value based upon its current and previous value.
• By default the wrap is true in a Dial, so it moves from the end - start.
• For values at the notches,just have a look at my sample code.
• By default tickmarksVisible property is true,to customize the tickmark you just need to customize the dial using the style and DialStyle and inside DialStyle you can use the tickmark.

Here is the sample code:-

Dial {
        width: 200
        height: 200
        stepSize: 1
        minimumValue: 0
        maximumValue: 10
        rotation: 150

        onValueChanged: {
            //####Logic for clockwise rotation
        }

        style: DialStyle {
            tickmark: Item {
                height: 20
                width: 20
                Rectangle {
                    height: 5
                    width: 5
                    radius: 5
                    color: "red"
                    anchors.bottom: parent.bottom
                    anchors.horizontalCenter: parent.horizontalCenter
                }

                Text {
                    text: styleData.value
                    font.pixelSize: 10
                    anchors.top: parent.top
                    anchors.horizontalCenter: parent.horizontalCenter
                }
            }
        }
    }

Note:- If you want only the starting value then just make this change inside the text

visible: styleData.index === 0

Output of sample code:-

[Gourmet]

@Shrinidhi-Upadhyaya said in QML Dial is weak or I miss something?:

By default the wrap is true in a Dial, so it moves from the end - start.

Not just "wrapped" moving from end to start and back - but closed. It must be non-torn circle. End position must be at same place as start.