Qt Reference Documentation

QML NumberAnimation Element

The NumberAnimation element animates changes in qreal-type values. More...

Inherits PropertyAnimation

Inherited by SmoothedAnimation.

  • List of all members, including inherited members
  • Properties

    Detailed Description

    NumberAnimation is a specialized PropertyAnimation that defines an animation to be applied when a numerical value changes.

    Here is a NumberAnimation applied to the x property of a Rectangle as a property value source. It animates the x value from its current value to a value of 50, over 1000 milliseconds:

     import Qt 4.7
     Rectangle {
         width: 100; height: 100
         color: "red"
         NumberAnimation on x { to: 50; duration: 1000 }

    Like any other animation element, a NumberAnimation can be applied in a number of ways, including transitions, behaviors and property value sources. The QML Animation documentation shows a variety of methods for creating animations.

    Note that NumberAnimation may not animate smoothly if there are irregular changes in the number value that it is tracking. If this is the case, use SmoothedAnimation instead.

    See also QML Animation and Animation basics example.

    Property Documentation

    from : real

    This property holds the starting number value.

    For example, the following animation is not applied until the x value has reached 100:

     Item {
         states: [ ... ]
         transition: Transition {
             NumberAnimation { properties: "x"; from: 100; duration: 200 }

    If this value is not set and the NumberAnimation is defined within a Transition, it defaults to the value defined in the start state of the Transition.

    to : real

    This property holds the ending number value.

    If this value is not set and the NumberAnimation is defined within a Transition or Behavior, it defaults to the value defined in the end state of the Transition or Behavior.


    Thank you for giving your feedback.

    Make sure it is related to this specific page. For more general bugs and requests, please use the Qt Bug Tracker.

    [0]; s.parentNode.insertBefore(ga, s); })();