QML中的SmoothedAnimation平滑动画

最新推荐文章于 2024-07-30 11:33:12 发布

炫彩灵感

最新推荐文章于 2024-07-30 11:33:12 发布

阅读量2.1k

点赞数

文章标签： QT QML 动画

本文链接：https://blog.csdn.net/xuancailinggan/article/details/50894032

版权

本文介绍了如何在QML中使用SmoothedAnimation创建平滑跟随鼠标的动画效果。通过实例代码展示了如何设置动画，使得红色矩形在单击后能持续跟踪鼠标位置，提供了一个直观的交互体验。

摘要由CSDN通过智能技术生成

平滑动画是numberAnimation的子类，只是默认的easing.type被做了改动而已。

现在要做的是单击鼠标以后，一个红色的矩形框可以一直跟随鼠标。

代码来自Qt Quick核心编程这本书作者安晓辉

代码如下：

import QtQuick 2.3
import QtQuick.Window 2.2

Window {
    visible: true
    width: 300
    height: 300

    MouseArea {
        anchors.fill: parent
        onClicked: {
            followAnimationy.from=follow.y
            followAnimationy.to=mouseY+4
            followAnimationy.start()
            followAnimationx.from=follow.x
            followAnimationx.to=mouseX+4
            followAnimationx.start()
        }
    }

    Rectangle{
    id:follow
    x:0
    y:0
    width: 100
    height: 100
    color: "red"
    }
    SmoothedAnimation{
    id:followAnimationy
    target: follow
    property: "y"
    duration: 3000

    }
    SmoothedAnimation{
    id:followAnimationx
    targe