如何在黑莓级联QML中创建翻转动画

Question

我是黑莓级联的新手，我已经从github的黑莓级联样本中查看了一些动画，但我不确定如何实现页面翻转动画而不是默认推送和流行动画。下面是执行默认推送转换到下一页的页面代码。我需要用翻转替换这个过渡。我应该怎么做呢？

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