QML文档阅读笔记-easing.type解析与实例

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq78442761/article/details/83343855

easing.type
指定动态缓和曲线
官方给出的伪代码：
 

  PropertyAnimation { properties: "y";
                      easing.type: Easing.InOutElastic;
                      easing.amplitude: 2.0;
                      easing.period: 1.5 }

很有意思的一个属性！
其中的参数为：
PropertyAnimation::easing.type
在Qt助手里面可查，相关缓和程度

在此，给出一个例子

运行截图如下：

伪代码如下：

（拷贝到QML文件里面加一个根结点就可以跑）

    Text {
        id: helloText
        text: qsTr("Hello world")
        color: "blue"
        font.pixelSize: 50
        font.family: "Times New Roman"
        anchors.centerIn: parent

        MouseArea {
            id: mouseArea
            anchors.fill: parent
        }

        states: State {
            name: "down"
            when: mouseArea.pressed === true

            PropertyChanges {
                target: helloText
                rotation : 360
                color: "red"
            }
        }

        transitions: Transition {
            from: ""
            to: "down"
            reversible: true

            ParallelAnimation {
                NumberAnimation { properties: "rotation"; duration: 500; easing.type: Easing.InOutQuad }
                ColorAnimation { duration: 500 }
            }
        }
    }