[Solved] How to dynamic setting Glow effect with item

[Jianren Yin]

I want to apply Glow effect to text when click. Here is my code:
@
import QtQuick 2.0
import QtGraphicalEffects 1.0

Rectangle {
width: 200; height: 200
color: "black"

Text {
    id: text
    anchors.centerIn: parent
    text: "Hello Qt!"
    font.pixelSize: 30
    color: "white"
}/* : Work but not my expectation
Glow {
    anchors.fill: text
    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
    }
}*/

Loader {
    id: loader
    focus: true
}

MouseArea {
    anchors.fill: parent
    onClicked: {
        console.log("Clicked")
        loader.sourceComponent = glowEffect
    }
}

Component {
    id: glowEffect
    Glow {
        anchors.fill: parent
        source: parent
        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
        }
    }
}

}
@

No effect. Maybe glow.source is incorrect, but how to set the source with "text" ?

Thanks in advance:)

[Jianren Yin]

@
//            anchors.fill: parent
            x: text.x; y: text.y  
            width: text.width; height: text.height
            source: text
@