动画持续时间不正确

Question

我注意到 QML 的动画行为非常奇怪。我开发了一个测试应用程序来使用动画功能。在办公室的 PC 上，我在 Windows 7 64 位下安装了 Qt 5.4。

我确定动画 "played" 比预期的持续时间快。例如

// *** Image item for "Failure" event ***
    Image{
        id: failPanel
        x: 300
        y: -300
        source: "images/fail.png"
        scale: 0.5
        visible: false

        function startAnim() {
            visible = true
            x =  300
            y =  -300
            failAnim.restart()
        }

        SequentialAnimation {
            id: failAnim
            NumberAnimation{ target: failPanel; property: "y"; to:300; duration: 700; easing.type: Easing.InOutQuad}
            NumberAnimation{ target: failPanel; property: "y"; to:500; duration: 2000 }
            NumberAnimation{ target: failPanel; property: "x"; to:-1500; duration: 700; easing.type: Easing.InBack}
        }
    }

一切播放速度都比指定的持续时间快得多我没有注意它，直到我在家里用更快的 PC（Windows 8 64 位）重新编译相同的源代码。在我的个人电脑上，动画按预期时间播放...

很奇怪。好吧，我想知道是否有人已经遇到过这个问题，或者是否有与此主题相关的特定 QML 设置？

Answer 1

您可以使用JavaScript的Date对象来验证时间是否正确：

import QtQuick 2.0
import QtQuick.Window 2.0

Window {
    id: root
    y: 30
    width: 1000
    height: 800
    visible: true

    Rectangle{
        id: failPanel
        x: 300
        y: -300
        color: "red"
        scale: 0.5
        width: 400
        height: 400
        visible: false

        property var startDate

        Component.onCompleted: startAnim()

        function startAnim() {
            visible = true
            x =  300
            y =  -300
            failAnim.restart()

            startDate = new Date()
            print("started animation at", startDate.toISOString())
        }

        SequentialAnimation {
            id: failAnim
            NumberAnimation{ target: failPanel; property: "y"; to:300; duration: 700; easing.type: Easing.InOutQuad}
            NumberAnimation{ target: failPanel; property: "y"; to:500; duration: 2000 }
            NumberAnimation{ target: failPanel; property: "x"; to:-1500; duration: 700; easing.type: Easing.InBack}

            onStopped: print("finished animation at", new Date().toISOString())
        }
    }
}

对我来说（Windows 10，Qt 5.6），它有效：

qml: started animation at 2016-01-31T06:29:31.209Z
qml: finished animation at 2016-01-31T06:29:34.631Z

您的问题听起来类似于 this 错误报告。您或许也能在那里找到类似的。

如果可能的话，我还建议尝试使用更新版本的 Qt。

Answer 2

我工作的公司也有类似的问题。问题似乎是我们在启动动画后占用了主线程几毫秒。如果主线程正在工作，则 gui 不会更新，因为没有处理任何更新事件。当控制最终 returns 到事件循环时，所有更新事件都会立即处理，导致动画 ro 运行更快。

解决方案是在您的程序运行空闲时启动动画。最简单的方法可能是连接一个插槽以使用排队连接的信号启动动画。然后动画将在控制权交给事件循环后开始。

动画持续时间不正确

Incorrect animation duration

c++

qt

qml

qtquick2