36.qt quick-DropShadow背景阴影

import QtQuick 2.12
import QtQuick.Window 2.12
import QtGraphicalEffects 1.12
Window {
    id: wind
    visible: true
    width: flipable.width * 1.3
    height: flipable.height * 1.3
    flags: Qt.Window | Qt.FramelessWindowHint
    property var angleVlue : 0
    color: "#00000000"

    Flipable {
       id: flipable
       width: 426
       height: 327
       y:  (wind.height - height) /2
       x: (wind.width - width) /2
       property bool flipped: false

       front: Image {
           id: frontImage
           anchors.fill: flipable
           source: "qrc:/1.png"
           smooth: true
           antialiasing: true
           layer.enabled: true
           layer.effect: DropShadow {
           }

       }
       back: Image {
           id: backImage
           anchors.fill: flipable
           source: "qrc:/2.png"
           smooth: true
           antialiasing: true
           layer.enabled: true
           layer.effect: DropShadow {
           }
       }


       transform: Rotation {
           id: rotation
           origin.x: flipable.width/2
           origin.y: flipable.height/2
           axis { x: 0; y: 1; z: 0 }     // set axis.y to 1 to rotate around y-axis
           angle: 0    // the default angle

       }

       states: State {
           name: "back"
           PropertyChanges { target: rotation; angle: 180 }
           when: flipable.flipped
       }

       transitions: Transition {
           NumberAnimation { target: rotation; property: "angle"; duration: 1000 ; easing.type: Easing.OutQuad}
       }

       MouseArea {
           anchors.fill: parent
           onClicked: {
               flipable.flipped = !flipable.flipped
           }
       }
    }
}