Roson的Qt之旅#48 QML并行动画(ParallelAnimation)

骑猪看日落 2022-09-14 11:10 163阅读 0赞

# 1.继承关系 #

父类：Animation

子类：无

# 2.详细描述 #

SequentialAnimation和ParallelAnimation类型允许多个动画一起运行。SequentialAnimation中定义的动画会一个接一个地运行，而ParallelAnimation中定义的动画会同时运行。  
下面的动画并行运行两个数字动画。矩形移动到(50,50)通过同时动画它的x和y属性。

import QtQuick 2.9
    import QtQuick.Window 2.2
    import QtQuick.Controls 2.2
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
    
        Rectangle {
            id: rect
            width: 100; height: 100
            color: "red"
    
            ParallelAnimation {
                running: true
                NumberAnimation { target: rect; property: "x"; to: 50; duration: 1000 }
                NumberAnimation { target: rect; property: "y"; to: 50; duration: 1000 }
            }
        }
    }

![2b8787b2b8324c8f9434257fc034797f.gif][]

与任何其他动画类型一样，ParallelAnimation可以以多种方式应用，包括转换、行为和属性值源。Qt Quick文档中的动画和过渡显示了创建动画的各种方法。

注意:一旦一个动画被分组为SequentialAnimation或ParallelAnimation，它就不能单独启动和停止;SequentialAnimation或ParallelAnimation必须作为一个组启动和停止。

更多信息请查阅SequentialAnimation, Animation and Transitions in Qt Quick, and Qt Quick Examples - Animation。

[2b8787b2b8324c8f9434257fc034797f.gif]: /images/20220828/62cbfe5e3e29488d8c5f0b1aaa724284.png

发表评论取消回复

表情：

评论列表（有 0 条评论，163人围观）

还没有评论，来说两句吧...

相关阅读

相关 Roson的Qt之旅#53 QML动画脚本(ScriptAction)

1.继承关系父类：Animation 子类：无 2.详细描述 ScriptAction可用于在动画的特定点运行脚本。 SequentialAnima

短命女/ 2022年09月15日 11:43/ 0 赞/ 169 阅读

相关 Roson的Qt之旅#49 QML动画之Behavior

1.继承关系 Behavior和Animation之间不存在继承关系，但是Behavior有一个成员变量是Animation类型的： \[default\] anim

柔情只为你懂/ 2022年09月14日 15:16/ 0 赞/ 190 阅读

相关 Roson的Qt之旅#48 QML并行动画(ParallelAnimation)

1.继承关系父类：Animation 子类：无 2.详细描述 SequentialAnimation和ParallelAnimation类型允许多个动画一起运

骑猪看日落/ 2022年09月14日 11:10/ 0 赞/ 164 阅读

相关 Roson的Qt之旅#47 QML序列动画SequentialAnimation

1.继承关系父类：Animation 子类：无 2.详细说明 SequentialAnimation和ParallelAnimation类型允许多个动画一起运

短命女/ 2022年09月14日 11:09/ 0 赞/ 162 阅读

相关 Roson的Qt之旅#46 QML属性动画PropertyAnimation

1.继承关系父类：Animation 子类:ColorAnimation, NumberAnimation, RotationAnimation, and Ve

Dear 丶/ 2022年09月14日 09:47/ 0 赞/ 224 阅读

相关 Roson的Qt之旅#41 QML父动画(ParentAnimation)

1.继承关系父类：Animation 子类：无 2.综述 ParentAnimation用于动画一个项目的父变化。例如，下面的ParentCha

短命女/ 2022年09月14日 09:44/ 0 赞/ 59 阅读

相关 Roson的Qt之旅#39 QML数字动画(NumberAnimation)

1.简介 NumberAnimation是一个专门的PropertyAnimation，它定义了当数值改变时应用的动画。这里是一个NumberAnimation应用

我就是我/ 2022年09月14日 09:41/ 0 赞/ 33 阅读

相关 Roson的Qt之旅#44 QML旋转动画(RotationAnimation)

1.继承关系父类：PropertyAnimation 子类：无 2.综述 RotationAnimation是一个专门的PropertyAnimation，它

今天药忘吃喽~/ 2022年08月28日 10:40/ 0 赞/ 223 阅读

相关 Roson的Qt之旅#42 QML路径动画PathAnimation

1.继承关系父类：Animation 子类：无 2.综述在transition中使用时，可以指定路径而不指定起点或终点，例如： PathAnima

分手后的思念是犯贱/ 2022年08月28日 10:40/ 0 赞/ 201 阅读

相关 Roson的Qt之旅#52 QML弹簧动画(SpringAnimation)

1.继承关系父类：NumberAnimation 子类：无 2.详细描述 SpringAnimation模仿弹簧的振荡行为，用适当的弹簧常数来控制加速度，用阻

柔光的暖阳◎/ 2022年08月28日 06:53/ 0 赞/ 180 阅读