QML 发光呼吸动画字体

前言

用 QML 来实现一个呼吸动画效果的字体，非常酷炫，主要使用 Glow 组件来实现，然后通过控制透明度的改变来实现想要的效果，代码非常简单。

正文

先来看看效果

源码：

Item {

    Rectangle {
        anchors.fill: parent
        color: "black"
    }

    Text {
        id: text
        anchors.fill: parent
        text: qsTr("ADBASn你好")
        font.bold: true
        font.pixelSize: 50
        color:"white"
        horizontalAlignment: Text.AlignHCenter
        verticalAlignment: Text.AlignVCenter
    }

    Glow {
        anchors.fill: text
        radius:9
        samples: 13
        color: "#ddd"
        source: text
        spread: 0.5
        opacity: 0.8
        NumberAnimation on opacity {
            id:an1
            to:0.8
            duration: 2000
            running: true
            onStopped: {
                an2.start()
            }
        }
        NumberAnimation on opacity {
            id:an2
            to:0.2
            duration: 2000

此外，还可以通过修改 Glow 的参数来实现不同的效果，具体可以看 Qt 帮助文档。
源码在这里​​​点击下载​​