如何在黑莓小瀑布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 
    } 
}