PathInterpolator QML Type

指定如何沿路径手动制作动画。更多

Import Statement: import QtQuick

属性

详细说明

PathInterpolator 为路径上的特定progress 提供xyangle 信息。

在下面的示例中,我们将沿着贝塞尔路径制作一个绿色矩形的动画。

import QtQuick

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
    }
}

属性文档

x : real [read-only]

y : real [read-only]

这些属性保存路径在progress 的位置。


angle : real [read-only]

该属性保存路径在progress 处的切线角度。

角度按顺时针方向报告,3 点钟位置为零度。


path : Path

该属性为插值路径。

有关定义路径的更多信息,请参阅Path 文档。


progress : real

该属性显示路径上的当前进度。

PathInterpolator 的典型用法是设置进度(通常通过NumberAnimation ),并读取相应的 x、y 和角度值(通常通过这些值的绑定)。

进度范围从 0.0 到 1.0。


© 2025 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.