QML如何对属性的每次更改进行动画处理?(只有最后一个更改动画可见）

QML how to animate every change of a property? (only the last change animation is visible)

本文关键字：动画 处理 最后一个 属性 QML      更新时间：2023-10-16

我必须制作一个由C++控制的机械计数器。我是从包含数字(0,1,2,3,4,5,6,7,8,9,0(的图像中完成的。一次只能看到一位数字。我希望这个计数器只在一个方向(向上(上变化，我想出了这个理论：如果新数字小于旧数字，我首先转到最后一个零，然后禁用动画，转到第一个零，启用动画，最后转到想要的数字。但这行不通。它立即移动到第一个零，然后与动画一起移动到所需的数字。这是代码：

import QtQuick 2.4
import QtQuick.Window 2.2
Window {
    id: mainWindow
    visible: true
    visibility: "Maximized"
    property int digit0Y: 0
    property bool anim0Enabled: true
    Item {
        id: root
        visible: true
        anchors.fill: parent
        Rectangle {
            id: container
            width: 940; height:172
            anchors.centerIn: parent
            clip: true
            color: "black"
            NumberElement {
                id: digit0
                y: mainWindow.digit0Y; x: 0
                animationEnabled: anim0Enabled
            }
        }
    }
}

The NumberElement.qml：

import QtQuick 2.0
Rectangle {
    id: root
    property bool animationEnabled: true
    width: 130; height: 1892
    color: "transparent"
    Behavior on y {
        enabled: root.animationEnabled
        SmoothedAnimation { velocity: 200; duration: 1500; alwaysRunToEnd: true }
    }
    Image {
        id: digits
        source: "http://s30.postimg.org/6mmsfxdb5/cifre_global.png"
    }
}

编辑：

#include <QQmlComponent>
#include <QGuiApplication>
#include <QThread>
#include <QQmlApplicationEngine>
#include <QQmlProperty>
#include <QDebug>
int number = 0;
int oldDigit = 0;
void set(QObject *object, int number) {
    int newDigit = number%10;
    if (newDigit < oldDigit) {
        QQmlProperty::write(object, "digit0Y", -1720);
        QQmlProperty::write(object, "anim0Enabled", false);
        QQmlProperty::write(object, "digit0Y", 0);
        QQmlProperty::write(object, "anim0Enabled", true);
    }
    QQmlProperty::write(object, "digit0Y",newDigit*(-172));
    oldDigit = newDigit;
}
int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
    QQmlEngine engine;
    QQmlComponent component(&engine, QUrl(QStringLiteral("qrc:/main.qml")));
    if (component.status() == QQmlComponent::Error) {
        qWarning() << component.errorString();
        return 1;
    }
    QObject *object = component.create();
    set(object, 9);
    //QThread::msleep(1000);
    set(object, 1);
    return app.exec();
}

通常，一个单独的类负责设置与某些事件相关的数字，但我试图简化以演示我的问题。在上面的例子中，数字去1，不关心set(object, 9)。这是我的问题。

您需要等待第一个动画完成，然后再开始第二个动画。你可能会想，"但我把alwaysRunToEnd定为true......"，但这在这里无济于事：

此属性保存动画在停止时是否应运行到完成。

如果为 true，则动画将在停止时完成其当前迭代 - 通过将 running 属性设置为 false 或调用 stop(( 方法。

当前的情况是，您将9设置为数字，这告诉动画它应该开始动画，但是您给出的下一条指令是将1设置为数字，它告诉动画停止它正在执行的操作并动画此新更改。

一般来说，从QML处理Qt Quick动画更容易。

我还建议PathView这个特定的用例，因为它可能会更容易实现你所追求的目标。

相关文章：