Qt移动应用开发（四）：应用粒子特效

浏览数：17 / 时间：2015年06月11日

Qt移动应用开发（四）：应用粒子特效

上一篇文章介绍了Qt Quick是怎样对帧动画进行支持的。帧动画的实现离不开状态机、而状态机、动画和状态切换（transitions）则是Qt框架的核心内容，也就是说它们可以建立在任何一个QObject对象中而不必非得依赖Qt的任何图形显示模块。拿一个例子说吧，如果你想实现背景音乐的平滑过渡，你可以不用写多余的代码，将背景音乐的音量作一下动画插值就可以达到效果了。事实上我制作的游戏《吃药了》就是这么实现效果的。而这一篇文章将要聚焦的是Qt Quick另外一个非常强大的系统——粒子系统。

原创文章，反对未声明的引用。原博客地址：http://blog.csdn.net/gamesdev/article/details/34114501

得益于Qt Quick对粒子系统的理解和抽象，我们可以使用粒子系统制作出很多强大的特效，虽然官方给出的例子只有2D的粒子，但是我们可以通过自定义顶点着色器和片断着色器来让它支持3D的例子特效。

下面是Qt自带的粒子系统演示程序截图：

而制作一个这么美轮美奂的粒子系统效果也不难。接下来我们就创建一个简单的项目来看看：

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Particles 2.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("测试粒子系统")

    menuBar: MenuBar {
        Menu {
            title: qsTr("文件")
            MenuItem {
                text: qsTr("退出")
                onTriggered: Qt.quit();
            }
        }
    }

    ParticleSystem
    {
        anchors.centerIn: parent
        ImageParticle
        {
            source: "qrc:///particleresources/fuzzydot.png"
            colorVariation: 1.0
        }

        Emitter
        {
            emitRate: 20
            size: 10
            lifeSpan: 4000
            velocity: AngleDirection
            {
                magnitude: 100
                angleVariation: 360
            }
        }
    }

    Text
    {
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        text: qsTr("本例用来测试粒子系统")
    }
}

程序的效果截图如下：

那么从上面的演示程序我们可以得知，一个粒子系统基本是由ParticleSystem、ImageParticle以及Emitter组成的。其中ParticleSystem必不可少，因为这是要控制好各个粒子系统组件的必备类型。如果ParticleSystem是不作为Emitter的父类存在的话，那么Emitter有一个成员system必须要指定ParticleSystem的id。Emitter也是一个必不可少的类，它的作用是规定这些例子以何种方式发射、以及规定粒子的大小和生命周期。而ImageParticle是ParticlePainter的子类，它不是必备的，我们可以采用ParticlePainter的其它子类CustomParticle和ItemParticle来指定。它的作用是规定粒子的图片以及旋转、颜色、透明度等信息。

其实在三者之外，还有一个不可忽视的类，那就是Affector。一般来说，粒子在Emitter作用后会保持初始的速度、加速度和大小进行运动，此后这些数值不再受Emitter控制了，只有Affector才能控制粒子在运行过程中的数值大小。这里Affector只是一个基类，在它的基础上定义出来了很多根据不同效果而定义的子类。比如说Age、Attractor、Friction、Gravity、GroupGoal、SpriteGoal、Turbulence和Wander。这里我们拿出一个简单的Affector——Gravity来继续我们的实验。

ParticleSystem
{
    anchors.centerIn: parent
    ImageParticle
    {
        source: "qrc:///particleresources/fuzzydot.png"
        colorVariation: 1.0
    }

    Emitter
    {
        emitRate: 20
        size: 10
        lifeSpan: 4000
        velocity: AngleDirection
        {
            magnitude: 100
            angleVariation: 360
        }
    }

    Gravity
    {
        angle: 90
        magnitude: 100
    }
}

演示程序的截图如下：