PathInterpolator QML Type
Specifies how to manually animate along a path. More...
Import Statement: | import QtQuick 2.15 |
Properties
Detailed Description
PathInterpolator provides x
, y
, and angle
information for a particular progress
along a path.
In the following example, we animate a green rectangle along a bezier path.
import QtQuick 2.0 Rectangle { width: 400 height: 400 PathInterpolator { id: motionPath path: Path { startX: 0; startY: 0 PathCubic { x: 350; y: 350 control1X: 350; control1Y: 0 control2X: 0; control2Y: 350 } } NumberAnimation on progress { from: 0; to: 1; duration: 2000 } } Rectangle { width: 50; height: 50 color: "green" //bind our attributes to follow the path as progress changes x: motionPath.x y: motionPath.y rotation: motionPath.angle } }
Property Documentation
angle : real |
This property holds the angle of the path tangent at progress.
Angles are reported clockwise, with zero degrees at the 3 o'clock position.
path : Path |
This property holds the path to interpolate.
For more information on defining a path see the Path documentation.
progress : real |
This property holds the current progress along the path.
Typical usage of PathInterpolator is to set the progress (often via a NumberAnimation), and read the corresponding values for x, y, and angle (often via bindings to these values).
Progress ranges from 0.0 to 1.0.
© 2024 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.