Qt5 – 動態載入Glow等特效

import QtQuick 2.0import QtGraphicalEffects 1.0Rectangle {    width: 200; height: 200    color: "black"    Text {        id: text        anchors.centerIn: parent        text: "Hello Qt!"        font.pixelSize: 30        color: "white"    }    Loader {        id: loader        focus: true    }    MouseArea {        anchors.fill: parent        onClicked: {            console.log("Clicked")            loader.sourceComponent = glowEffect        }    }    Component {        id: glowEffect        Glow {//            anchors.fill: parent            x: text.x; y: text.y            width: text.width; height: text.height            source: text            color: "red"            radius: 10            samples: 20            visible: true            NumberAnimation on spread {                from: 0; to: 0.8; duration: 1000                loops: NumberAnimation.Infinite                easing.type: Easing.InOutQuad            }        }    }}

點擊載入glow特效

更改載入條件，滑過就載入，離開就卸載：

        MouseArea {            id: mouseArea            anchors.fill: parent            hoverEnabled: true            onClicked: {                root.clicked()                console.log("Clicked " + text.text)            }            onEntered: {                loader.sourceComponent = glowEffect     // 載入            }            onExited: {                loader.sourceComponent = loader.Null    // 卸載            }        }