第14章：QML之 OhterAnimation

bandaostart

于 2019-03-26 07:50:58 发布

阅读量165

点赞数

CC 4.0 BY-SA版权

分类专栏： QT5编程与实例

本文链接：https://blog.youkuaiyun.com/ksmtnsv37297/article/details/88811897

QT5编程与实例专栏收录该内容

66 篇文章

订阅专栏

本文通过Qt Quick 2.0演示了不同类型的动画应用，包括颜色、旋转、数值变化及属性动画等，展示了如何使用代码实现矩形的颜色渐变、旋转、半径变化及位置平滑移动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，其它动画元素
2，源码

import QtQuick 2.0

Rectangle{
    width: 80
    height: 80

    //动画元素允许颜色设置，作用越颜色
    ColorAnimation on color {
        from: "blue"
        to: "aqua"
        duration: 10000
        loops: Animation.Infinite
    }

    //动画元素允许设定图形旋转，作用越rotation
    RotationAnimation on rotation {
        from: 0
        to: 360
        duration: 10000
        direction: RotationAnimation.Clockwise
        loops: Animation.Infinite
    }

    //允许数字类型的值改变动画元素,作用于radius
    NumberAnimation on radius {
        from: 0
        to: 40
        duration: 10000
        loops: Animation.Infinite
    }

    //属性动画元素
    PropertyAnimation on x{
        from: 50
        to: 500
        duration: 10000
        loops: Animation.Infinite
        easing.type: easing.InOutQuad
    }
}

import QtQuick 2.6

Rectangle {
    property alias mouseArea: mouseArea
    property alias textEdit: textEdit

    width: 360
    height: 360

    MouseArea {
        id: mouseArea
        anchors.fill: parent
    }

    TextEdit {
        id: textEdit
        visible: false
    }

    CircleRect{
        x: 50; y:30
    }
}

3，效果
在这里插入图片描述