QML RotationAnimation 不旋转

Question

我正在尝试将矩形从指定角度旋转到指定角度，但我不确定我是否理解文档。我下面的代码运行，我开始和完成的插槽打印出正确的角度。但是矩形在屏幕上没有旋转。我错过了什么？

Rectangle {
  width: 100
  height: 100
   RotationAnimation {
        id: rotateCritter
        duration: 1000
        property real lastAngle: 0
        onStarted: {
            lastAngle = to;
            console.log("Rotating from "+from+" to "+to)
        }
        onStopped: {
            console.log("Done rotating from "+from+" to "+to)
            from = lastAngle;
        }
    }
}


// On click totate the critter to the new angle
rotateCritter.to =  45
rotateCritter.start()

Answer 1

您的 RotationAnimation 少了一个 target。虽然它是 Rectangle 的子元素，但这种关系不会自动使 Rectangle 成为动画的 target；它必须是明确的。我已经给 Rectangle 一个 id 和 color，并将其设为动画的 target：

    Rectangle {
        id: critter
        width: 100
        height: 100
        color: "red"

        RotationAnimation {
            id: rotateCritter
            target: critter
            duration: 1000
            property real lastAngle: 0
            onStarted: {
                lastAngle = to;
                console.log("Rotating from "+from+" to "+to)
            }
            onStopped: {
                console.log("Done rotating from "+from+" to "+to)
                from = lastAngle;
            }
        }
    }

Answer 2

除了使用 RotationAnimation 对象之外的另一个想法是仅使用 Behavior.

在矩形 rotation 属性上设置动画

Rectangle {
    id: rect
    width: 100
    height: 100
    Behavior on rotation {
        NumberAnimation {
            duration: 1000
        }
    }
}

rect.rotation = 45   // Animates to 45 degrees

...

rect.rotation = 0    // Animates back to 0 degrees

QML RotationAnimation 不旋转

QML RotationAnimation is not rotating

qt

animation

rotation

qml