import QtQuick 2.11
Rectangle {
    width: 640
    height: 480
    color: "#0ff90f"
    Flipable {
            id: flip
            width: 300
            height: 300
            anchors.centerIn: parent
            property bool flipped: false
            front: Image{
                anchors.fill: parent
                source: "file:///C:/Users/Administrator/Desktop/11111/2099720.png"
                transform: Rotation{
                    origin.x: flip.width / 2
                    origin.y: flip.height / 2
                    axis.x: 0
                    axis.y: 1
                    axis.z: 0
                    angle: 180
                }
            }
            back: Image{
                anchors.fill: parent
                source: "file:///C:/Users/Administrator/Desktop/11111/2099720.png"
            }
            transform: Rotation{
                id: rotation
                origin.x: flip.width / 2
                origin.y: flip.height / 2
                axis.x: 0
                axis.y: 1
                axis.z: 0
                angle: 0
            }
            states:State{
                PropertyChanges {
                    target: rotation
                    angle: 180
                }
                when:flip.flipped
            }
            transitions: Transition{
                NumberAnimation{
                    target:rotation
                    properties: "angle"
                    duration: 240
                }
            }
            MouseArea {
                anchors.fill: parent
                onClicked:  flip.flipped = !flip.flipped
            }
        }
}