QML —— 顺序动画,足球落地示例(附完整源码)

效果

源码
cpp 复制代码
import QtQuick 2.12
import QtQuick.Window 2.12

Window
{
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    MouseArea
    {
        anchors.fill: parent
        onClicked:{setSequentialAnimationState(true)}
    }

    Component.onCompleted:{setSequentialAnimationState(false)}
    Component.onDestruction:{setSequentialAnimationState(false)}

    function setSequentialAnimationState(b)
    {
        if(b)
        {
            if(!sequentialAnimation.running){sequentialAnimation.start()}
        }
        else
        {
             if(sequentialAnimation.running){sequentialAnimation.stop()}
        }
    }

    Image
    {
        id: ballImg
        source: "ball.jpeg"
        scale: 0.3
        y: -height
        anchors.horizontalCenter: parent.horizontalCenter

        SequentialAnimation on y
        {
            id: sequentialAnimation
            loops: Animation.Infinite
            NumberAnimation
            {
                id: fallNumberAnimation
                to: ballImg.parent.height - ballImg.height
                easing.type: Easing.OutBounce
                duration: 2000
            }

            PauseAnimation {duration: 1000}

            NumberAnimation
            {
                to: -ballImg.height
                easing.type: Easing.OutQuad
                duration: 500
            }

        }
    }
}

关注

笔者 - jxd

相关推荐
Android小码家6 小时前
Vscode + docker + qt 网络监听小工具
vscode·qt·docker
yudiandian20147 小时前
【QT 5.12.12 打包-Windows 平台下】
开发语言·qt
XXYBMOOO10 小时前
Qt UDP 通信类详解与实现
开发语言·网络·c++·qt·网络协议·ui·udp
jzzy_hony11 小时前
移植Qt4.8.7到ARM40-A5
qt·ubuntu·arm·终端
新手村领路人17 小时前
QT6 配置 Copilot插件
qt·ai编程
会飞的胖达喵17 小时前
Qt Model/View/Delegate 架构详解
开发语言·qt·架构
edjxj17 小时前
Qt添加图标资源
开发语言·数据库·qt
Jiezcode1 天前
Qt QJsonObject
c++·后端·qt
眠りたいです2 天前
基于脚手架微服务的视频点播系统-界面布局部分(二):用户界面及系统管理界面布局
c++·qt·ui·微服务·云原生·架构·cmake
码农客栈2 天前
qt QWebSocket详解
qt