SequentialAnimation 和 ParallelAnimation 动画容器

SequentialAnimation中定义的动画是一个接一个地运行的,

以下示例按顺序运行两个数字动画。的矩形动画到 x 的50位,然后到达 y 50的位置。

import QtQuick 2.0

Rectangle {
    id: rect
    width: 100; height: 100
    color: "red"

    SequentialAnimation {
        running: true
        NumberAnimation { target: rect; property: "x"; to: 50; duration: 1000 }
        NumberAnimation { target: rect; property: "y"; to: 50; duration: 1000 }
    }
}

ParallelAnimation中定义的动画是同时运行的。

下面的动画并行运行两个数字动画 ,矩形移动到(50,50)由动画其 x 和 y 同时运行。

import QtQuick 2.0

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 }
    }
}
注意:将动画分组为SequentialAnimation或ParallelAnimation后,就无法单独启动和停止它了;
   在SequentialAnimation或ParallelAnimation必须启动并停止为一组。
posted @ 2023-01-10 16:26  Azuki_op  阅读(92)  评论(0编辑  收藏  举报