QML 顺序动画避免代码重复答案

【问题标题】：QML sequential animations avoid code duplicationQML 顺序动画避免代码重复
【发布时间】：2014-06-18 17:41:51
【问题描述】：

我在 QML 中使用 Qt3D 制作了一个小动画。动画的重点是让球沿着贝塞尔曲线从点 p0 移动到点 p2，给定一个我以某种方式计算的点 p1（与问题无关），这样我就得到了一个二次贝塞尔曲线。由于没有 BezierAnimation 之类的东西，我所做的是我有一个 Vector3DAnimation 从 p0 到曲线的 0.1 处的点，然后从 0.1 到 02，依此类推，直到 0.9 到 1（即 p2）。

这给了我这个看起来很糟糕的代码：

SequentialAnimation{
    loops: Animation.Infinite
    Vector3DAnimation{
        from: bezierAt(0)
        to: bezierAt(0.1)
        duration: durationFromSpeed(0,0.1,500)
    }
    Vector3DAnimation{
        from: bezierAt(0.1)
        to: bezierAt(0.2)
        duration: durationFromSpeed(0.1,0.2,500)
    }
    Vector3DAnimation{
        from: bezierAt(0.2)
        to: bezierAt(0.3)
        duration: durationFromSpeed(0.2,0.3,500)
    }
    ....
    Vector3DAnimation{
        from: bezierAt(0.9)
        to: bezierAt(1)
        duration: durationFromSpeed(0.9,1,500)
    }
}

正如您所见，代码非常简单，因为我将大部分代码封装在函数中，但它过于重复且可扩展性很差（如果我想要步长为 0.01，我会手动编写 100 个动画)。

所以，我的问题是，有没有什么办法可以让它变得更好？

我尝试使用 ScriptAction，如下所示：

SequentialAnimation{
    id: anim
    loops: Animation.Infinite
    property real current:0.0
    function incr() {
        current+=0.1
        current = current > 1? 0.0 : current
    }
    Vector3DAnimation{
       from: bezierAt(anim.current)
       to: bezierAt(anim.current+0.1)
       duration: durationFromSpeed(anim.current,anim.current+0.1,500)
    }
    ScriptAction: {script: incr();}
}

但是，奇怪的是，仅动画的第一部分（即使我检查并且当前更改正确），并且在 4 或 5 次迭代后突然停止工作。

有没有好看的方法来做到这一点？好想能够修改步骤...

非常感谢

【问题讨论】：

标签： animation qml bezier qt3d

【解决方案1】：

我终于成功了。

只需在 incr() 函数末尾添加 anim.restart() 即可完美运行。

【讨论】：