1. 程式人生 > >QML文件閱讀筆記-easing.type解析與例項

QML文件閱讀筆記-easing.type解析與例項

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 }
            }
        }
    }