QML旋转量规针-正确旋转

Question

我正在尝试旋转规针，但与其在具有十字形圆圈的针的底部进行枢转。.针绕着针的尖端枢转。请参见所附的图像。图像是固定的/枢轴的，但基座是旋转的。.请建议如何纠正此问题？

main.qml：-

import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Controls 2.5

Window
{
    visible: true
    x :0
    y :0
    width: 800
    height: 480
    color: "grey"

    Rectangle
    {
        id: cluster
        Speed_Needle{
          id: cluster_pointer_base
          x : 214+16
          y : 222
        }
     }

    Slider
    {
        id  : slide_1
        width: parent.width
        from: 0
        to: 360
        value: 0
        enabled: true
        onValueChanged:
        {
            cluster_pointer_base.value=slide_1.value
        }
    }

}

Speed_Needle.qml：-

import QtQuick 2.0

Item {

    property int value: 0
    width: 186
    height: 36

    Image
    {
        id: root
        source: "files/pointer_needle2.png"
        x : 0
        y : 0
        transform: Rotation  {
            id: needleRotation
            angle : value

            Behavior on angle  {

                SmoothedAnimation { velocity: 50 }
            }
        }



    }

}

Answer 1

您必须设置Rotation中的origin：

Speed_Needle.qml：-

import QtQuick 2.0

Item {

    property int value: 0
    width: 186
    height: 36

    Image
    {
        id: root
        source: "files/REE Demo images/pointer_needle2.png"
        x : 0
        y : 0
        transform: Rotation  {
            id: needleRotation
            angle : value
            origin.x: root.width / 2    // here!
            origin.y: root.height / 2

            Behavior on angle  {

                SmoothedAnimation { velocity: 50 }
            }
        }
    }
}