Qt5 - 圖形特效

Qt5 - 圖形特效

 

安裝QtGraphicalEffects 插件:

git clone [email protected]:qt-labs/qtgraphicaleffects.git

cd qtgraphicaleffects

qmake && nmake && nmake install

 

字體發光 (Glow Text):

.qml

---

import QtQuick 2.0
import QtGraphicalEffects 1.0
Rectangle {
    width: 640
    height: 480
    color: "black"
    Text  {
        id: xd
        anchors.centerIn: parent
        text: qsTr("\u6211\u662f\u4e2d\u6587Hello Qt")
        color: "red"
        font.pixelSize: 80
    }
    Glow {
        id: effect
        anchors.fill: xd
        color: "#FFFFFFFF"
//        spread: 0.8
        radius: 10
        NumberAnimation on spread {
            from: 0; to: 0.8; duration: 1000
            loops: NumberAnimation.Infinite
            easing.type: Easing.InOutQuad
        }
        // Worse
//        NumberAnimation on radius {
//            from: 1.0; to: 10; duration: 1000;
//            loops: NumberAnimation.Infinite
//            easing.type: Easing.InOutQuad
//        }
        samples: 20
        visible: true
        source: xd
    }
    MouseArea {
        anchors.fill: parent
        onClicked: {
            Qt.quit();
        }
    }
}

 

參考:

http://labs.qt.nokia.com/2012/02/02/qt-graphical-effects-in-qt-labs/