如何在黑莓小瀑布QML創建一個翻轉動畫QML

Question

我是黑莓小瀑布的新手，我已經看過一些來自github黑莓瀑布樣本的動畫，但我不確定如何實現翻頁和翻頁動畫而不是默認的推動和彈出式動畫。以下是執行默認推送轉換到下一頁的頁面的代碼。我需要用flip來替換這個轉換。我應該怎麼做呢？

NavigationPane { 
    id: nav 
    peekEnabled: false 
Page { 
    id: mainPage 

Button: 
{ 
onClicked:{ 

nav.push(homePageDefinition.createObject()); 
} 
} 

attachedObjects: [ 

    ComponentDefinition { 
     id: homePageDefinition 
     source: "homepage.qml" 
    } 
] 
} 
} 

Answer 1

嘗試Flipable項目。例如：

Flipable { 
    id: flipable 
    anchors.fill: parent 
    property bool flipped: false 
    front: Rectangle {anchors.fill: parent; color: "green"} 
    back: Rectangle {anchors.fill: parent; color: "yellow" } 
    transform: Rotation { 
     id: rotation 
     origin.x: flipable.width/2 
     origin.y: flipable.height/2 
     axis.x: 0; axis.y: 1; axis.z: 0 
     angle: 0 
    } 
    states: State { 
     name: "back" 
     PropertyChanges { target: rotation; angle: 180 } 
     when: flipable.flipped 
    } 
    transitions: Transition { 
     NumberAnimation { target: rotation; property: "angle"; duration: 500 } 
    } 
    MouseArea { 
     anchors.fill: parent 
     onClicked: flipable.flipped = !flipable.flipped 
    } 
}