Qt Reference Documentation

QML AnchorAnimation Element

The AnchorAnimation element animates changes in anchor values. More...

Inherits Animation

  • List of all members, including inherited members
  • Properties

    Detailed Description

    AnchorAnimation is used to animate an anchor change.

    In the following snippet we animate the addition of a right anchor to a Rectangle:

     import Qt 4.7
     Item {
         id: container
         width: 200; height: 200
         Rectangle {
             id: myRect
             width: 100; height: 100
             color: "red"
         states: State {
             name: "reanchored"
             AnchorChanges { target: myRect; anchors.right: container.right }
         transitions: Transition {
             // smoothly reanchor myRect and move into new position
             AnchorAnimation { duration: 1000 }
         Component.onCompleted: container.state = "reanchored"

    For convenience, when an AnchorAnimation is used in a Transition, it will animate any AnchorChanges that have occurred during the state change. This can be overridden by setting a specific target item using the target property.

    Like any other animation element, an AnchorAnimation 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.

    See also QML Animation and AnchorChanges.

    Property Documentation

    duration : int

    This property holds the duration of the animation, in milliseconds.

    The default value is 250.

    easing.type : enumeration

    easing.amplitude : real

    easing.overshoot : real

    easing.period : real

    To specify an easing curve you need to specify at least the type. For some curves you can also specify amplitude, period and/or overshoot. The default easing curve is Linear.

     AnchorAnimation { easing.type: Easing.InOutQuad }

    See the PropertyAnimation::easing.type documentation for information about the different types of easing curves.

    read-onlytargets : list<Item>

    The items to reanchor.

    If no targets are specified all AnchorChanges will be animated by the AnchorAnimation.


    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); })();