PropertyAnimation против NumberAnimation

Question

Приведенный ниже код анимирует два прямоугольника с поведением на x в QML. Один использует PropertyAnimation, другой использует NumberAnimation. Оба прямоугольника демонстрируют одинаковое движение. Кажется, я не вижу ничего особенного между двумя типами анимации.

import QtQuick 2.0
import QtQuick.Window 2.0

Window {
    visible: true
    width: 640
    height: 480

    Rectangle {
        id: r1
        width: 100; height: 100
        color: "red"

        Behavior on x { PropertyAnimation {} }
    }

    Rectangle {
        id: r2
        y: 150
        width: 100; height: 100
        color: "blue"

        Behavior on x { NumberAnimation {} }
    }

    MouseArea { anchors.fill: parent; onClicked: r1.x = r2.x = 200 }
}

В чем разница между PropertyAnimation и NumberAnimation; и когда я должен использовать один поверх другого?

Answer 1

tl; др.

NumberAnimation является производным от PropertyAnimation, и, таким образом, это имеет логический смысл для нихдемонстрировать аналогичное поведение.

NumberAnimation - это специализированная PropertyAnimation, которая определяет анимацию, которая будет применяться при изменении числового значения. _{(Источник)}

В то время как NumberAnimation специально анимирует числовые значения (например, x, y, width, opacity), PropertyAnimation является универсальным и может анимировать нечисловые (например, color, size).

---

Lé более длинный ответ:

1.PropertyAnimation может анимировать нечисловые типы.NumberAnimation только анимирует числа.

NumericAnimation может анимировать числовые свойства, такие как x, y, ширина, высота, непрозрачность.Но он не может анимировать цвет, размер или точек .

Вот пример, где типы анимации отличаются анимацией свойства color.Первый прямоугольник переходит с красного на зеленый, а второй прямоугольник остается синим.В этом случае PropertyAnimation следует использовать вместо NumberAnimation.

Rectangle {
    id: r1
    width: 100; height: 100
    color: "red"

    Behavior on color { PropertyAnimation {} }  // works
}

Rectangle {
    id: r2
    y: 150
    width: 100; height: 100
    color: "blue"

    Behavior on color { NumberAnimation {} }  // fails
}

MouseArea { anchors.fill: parent; onClicked: r1.color = r2.color = "green" }

Но опять же, вы можете ColorAnimation вместо ...

2,PropertyAnimation является общим.

Это дополнение от # 1 .Но это еще одно преимущество.

Поскольку PropertyAnimation является более общим, его можно использовать, если вы решите иметь динамический PropertyAnimation::property.

Вот пример, где свойство animation предоставляется пользователем:

Rectangle {
    id: rect
    width: 100; height: 100
    color: "red"
    PropertyAnimation { id: animation; target: rect }
}

MouseArea { 
    anchors.fill: parent
    onClicked: { 
        animation.property = t1.text;
        animation.to = t2.text;
        animation.start();
    }
}

Row {
    width: parent.width; height: 50
    anchors.bottom: parent.bottom
    TextField { id: t1; width: parent.width/2; height: 50; placeholderText: "property" }
    TextField { id: t2; width: parent.width/2; height: 50; placeholderText: "to" }
}

Использование NumberAnimation также работает, но ограничивает жизнеспособные свойства только числовыми ... пользователи не могут моделировать сверхновые или радуги.: (

3. NumberAnimation строгое.

Давайте сравним свойства from и to.

• NumberAnimation
  • from: real
  • to: real
• PropertyAnimation
  • from: variant
  • to: variant

Это делает NumberAnimation более строгим. QML предотвратитвы делаете глупые ошибки:

NumberAnimation {
    id: animation
    to: "green"    //  Invalid property assignment: number expected   
}

Используйте его, когда вы строго ограничены числами анимации.

Это также означает, что использование NumberAnimation может улучшить удобочитаемость и общение . Он сообщает людям, читающим ваш код, что вы только собираетесь анимировать числа, а не якоря, цвета, единорога или что-либо еще.

4. NumberAnimation более эффективен при анимации чисел.

- говорит Qt:

Специализированные типы анимации свойств имеют более эффективные реализации, чем тип PropertyAnimation. _{(Источник)}

Здесьe " специализированные типы " относится к NumberAnimation вместе с другими типами , такими как AnchorAnimation и ColorAnimation.

Я не пробовал профилировать QMLдля сравнения различий, но кажется, что эмпирическое правило для выбора типов анимации:

• Если вы анимируете числа, вам следует по умолчанию NumberAnimation.
• PropertyAnimation должен быть последним средством (предпочтительнее других типов ).