[提问] 如何正确使用Glow效果



  • 我想把http://labs.qt.nokia.com/2012/02/02/qt-graphical-effects-in-qt-labs/的效果 应用到listView的高亮的item上去。也就是当符合某条件时,激活glow效果。写了一个测试例子,点击"Text" 时激活glow效果,但是没有效果,麻烦大家指点一下。代码如下:
    @
    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
            }
        }
    }
    

    }
    @



  • 原因出在anchors.fill 和 source, 修改如下:
    @
    // anchors.fill: parent
    x: text.x; y: text.y
    width: text.width; height: text.height
    source: text
    @


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.