Qt用qml实现简单的粒子效果

原创 2016年08月28日 23:26:14

粒子系统,一直是各大游戏引擎标配的一个模块

粒子系统表示三维计算机图形学中模拟一些特定的模糊现象的技术,而这些现象用其它传统的渲染技术难以实现的真实感的 game physics。

经常使用粒子系统模拟的现象有火、爆炸、烟、水流、火花、落叶、云、雾、雪、尘、流星尾迹或者象发光轨迹这样的抽象视觉效果等等。

先熟悉一个英语单词:

Particle

英 [ˈpɑ:tɪkl]  美 [ˈpɑ:rtɪkl] 

n.  微粒,颗粒; [数,物]粒子,质点; 极小量; 小品词;

Qt Quick提供了一个粒子系统,提供了四种主要的 QML 类型:

ParticleSystem ,粒子系统,它维护一个粒子系统相关的 Emitters 、 Painters 、 Affectors ,Emitters 、 Painters 、 Affectors 要想一起玩儿,就得指定同一个 ParticleSystem。 ParticleSystem

Painters , 它负责渲染一个粒子。ParticlePainter 是基类, CustomParticle 、 ImageParticle 、 ItemParticle 是 Qt Quick 内置的三种粒子,都是 ParticlePainter 的派生类。

Emitters ,发射器,可以在给定的区域内突突突地发射逻辑粒子。具体的类为 Emitter 。

Affectors , 效果器,通过改变发射出去的逻辑粒子的属性来产生特效。 Qt Quick 内置了 Age 、 Gravity 、Friction 、 Attractor 等等效果器。

ParticleSystem

ParticleSystem 代表一个粒子系统,它维护一个公用的时间线,管理发射器、逻辑粒子与渲染器、效果器。它提供了一些属性:

empty ,布尔值,当粒子系统中的逻辑粒子都死翘翘时它被设置为 true 。也可以通过这个属性来暂停粒子系统,不过系统的时间线还是会更新。

paused ,布尔值,设置为 true ,粒子系统暂停,设置为 false ,粒子系统从暂停点恢复

running ,布尔值,设置为 false ,停止粒子系统。再次设置为 true 时,原先产生的那些逻辑粒子都会被销毁

particleStates ,Sprite 列表,列表中的每个 Sprite 的名字,与粒子系统中的某个粒子分组(ParticleGroup)的名字对应。 Sprite 用来定义粒子分组中的粒子状态变换时应用的效果。

ParticleSystem 还有一些方法,如 pause() 、 resume() ,基本上和属性对应,看看帮助就明了意思了。

Emitter

emitter

英 [ɪ'mɪtə]   美 [ɪ'mɪtə]   n.  发射器;

Emitter 用来发射逻辑粒子,在发射前, Emitter 会给逻辑粒子定义一些属性,比如大小、生命周期等,这些属性后续可以被效果器(Affector)改变。 Emitter 发射出来的逻辑粒子,必须要和一个具体的 ParticlePainter 联系起来,才会被渲染,我们才能看到。 Emitter 、 Painter 、 Affector 都有一个 system 属性,用来指定它们关联的 ParticleSystem ,如果三者的 system 属性指向同一个 ParticleSystem 实例,那它们就自动关联在一起了。

Emitter 类似一个普通的 Item ,它的 width 、 height 属性可以指定发射区域大小, anchors 可以完成布局。

Emitter 还有一些与粒子发射相关的属性:

size ,待发射的粒子的起始大小(像素),默认值为 16 。

endSize ,粒子寿命结束时的大小。在粒子的生命周期内,它的大小会从 size 到 endSize 线性变化。如果 endSize 为 -1 ,粒子大小则是固定的,始终是 size 。默认值为 -1 。

sizeVariation ,一个变量,设定粒子的 size 和 endSize 上下变化的最大范围,粒子系统会根据这个值,随便产生一个变量,添加到 size 和 endSize 属性上,用于产生大小随机变化的粒子。

lifeSpan ,寿命,单位是毫秒。默认为 1000 毫秒。

lifeSpanVariation ,一个变量,设定寿命的随机可变范围。默认为 0 。

emitRate ,发射频率,含义是每秒多少个。默认值为 10 。

velocity ,速度,类型是 StochasticDirection ,可以是 AngleDirection 、 PointDirection 、 TargetDirection 、 CumulativeDirection 中的一个。velocity 界定了粒子的运动方向。如果不指定 velocity 属性,粒子会在原地出生、变化、死亡。

Emitter 还有很多其它的属性,请参考 Qt 帮助。

TargetDirection

TargetDirection 是 Direction 的派生类,它的实例可以赋值给 Emitter 的 velocity 属性,用于指定 Emitter 发射的粒子的目标位置。

TargetDirection 的属性 targetItem 。 targetItem 用于指定目标位置关联的 Item 。在示例中,我定义了一个 Rectangle 对象,把它放在根窗口的右上方,然后将 TargetDirection 的 targetItem 属性指向这个 Rectangle 。当 targetItem 指向一个具体的 Item 时,targetX 、 targetY 属性就是相对于 targetItem 了。

ImageParticle

ImageParticle 是 Qt Quick 提供的图片粒子类,用来渲染图片。它的属性很多,在使用 system 指定它关联的粒子系统,使用 source 指定它使用的图片。

可以改变图片粒子的颜色(alpha 、 alphaVariation 、 redVariation 、 blueVariation 、 greenVariation ),旋转角度(rotation 、 rotationVariation 、 rotationVelocity 、rotationVelocityVariation )。

entryEffect 属性提供了一种简便的方式来设定粒子的进场、出场效果。默认值为 ImageParticle.Fade ,渐显渐隐,即在出现时透明度从 0 慢慢变为 1,消失时透明度从 1 变为 0 。我们的示例就是这种效果。它还可以取值 ImageParticle.None(没效果) 或 ImageParticle.Scale(出现时从 0 放大到 1,消失时从 1 缩小到 0 )。如果想获得更好地进场、出场效果,可以使用 sizeTable 和 opacityTable 。

在介绍上面的大致知识后,现在做一个简单的Qt粒子效果示例程序:

1.新建一个空的qmake project,取名:qzherParticle

2.新建一个main.cpp

3.新建一个Qt Resource File,取名为Res

4.在Res中添加一个QML File,取名为partical.qml

经过上述4步,把程序的空框架搭建起来

在此,用PS建立一个20X20大小的图片,绘制一个星状物,用于发射

存储为png,此图背景为透明色。原图:

将此图形添加到工程的资源中。

代码也主要分为两块:1.C++部分 2.qml部分

1 main.cpp

#include <QGuiApplication>

#include <QQuickView>

 

int main(int argc, char* argv[])

{

    QGuiApplication coreApp(argc, argv);

 

    QQuickView view;

    view.setSource(QUrl("qrc:/particle.qml"));

    view.setWidth(800);

    view.setHeight(600);

    view.setVisible(true);

 

    return coreApp.exec();

}

2. particle.qml

import QtQuick 2.2

 

// 用到 ParticleSystem 则必须导入粒子系统模块

import QtQuick.Particles 2.0

 

Rectangle {

    width: 800

    height: 600

 

    // 粒子系统

    ParticleSystem

    {

        anchors.centerIn: parent

 

        ImageParticle   // 图片粒子

        {

            source: "qrc:/img/particle.png" // 指定的图片

            colorVariation: 1.0 //颜色变化 0不变 1随机变化

        }

 

        // 发射器

        Emitter

        {

            x:0   // 发射器的位置,00)在窗口中心

            y:0

            emitRate: 100   // 每秒发射粒子数量

            size: 20        // 粒子大小

            lifeSpan: 1000  // 每个粒子的生命周期3

            velocity: AngleDirection    // 发射方向角度

            {

                magnitude: 200      // 速度值

                angleVariation: 360 // 角度变化最大值

            }

        }

    }

 

    // 显示的文字

    Text

    {

        x:0 // 此处(00)为窗口左上角,注意区分

        y:0

        z:100   // 将文字置于最顶层

        color: "#0b881c"

 

        text: qsTr("粒子系统qzher.com") // 文字

        font.family: "方正静蕾简体"   // 字体

        style: Text.Outline    // 以红色描边

        styleColor: "#e81919"

 

        font.pointSize: 40  // 字体大小

    }

}

还需在pro文件中添加:

QT += gui quick

最终效果:

源代码下载:http://download.csdn.net/detail/sinat_35523212/9602190

版权声明:更多文件,请访问 qzher.com 致力于良心IT培训,深圳QQ群:326023167

相关文章推荐

Qt用qml实现简单的粒子效果

最终运行效果: 涉及到的Qt知识点: 事件:鼠标事件,键盘事件,Paint事件,以及图片遮罩,定时器 新建一个空的qmake工程, loginDlg, 找一个带透明背景的png图片作为...

QT5之qml元素emitter

最近因为要跟着老师做一个项目,为了美化界面,让界面做的更炫。特意学起了qml,还好有点javascript的基础,不过没有也没关系。关于qml的参考文档,还很少,大多数都是英语的,就算有少数的中文参考...

用QML和Qt C++实现翻页效果的研究(1)

先占位,明天补上

Qt-QML-Button-ButtonStyle-实现鼠标滑过点击效果

上次实现的自定义的Button功能是用的自定义的Rectangle来实现的,在慢慢的接触了QML之后,发现QML有自己定义的Button 这里盗版贴上Qt帮助文档中的部分关于Button的属性内容 ...

【QT】QML的粒子系统及图形渲染

在QML中,有两种特效可以让UI更加绚丽多彩,一种是粒子系统,另一种是图形渲染。 下面先来看一下粒子系统。 粒子系统主要有四个QML类型,分别是ParticleSystem、Emitter、Parti...

Unity3D 粒子系统实现一个简单的爆炸效果

Unity3D 爆炸效果 粒子系统

Qt qml 模拟iphone slide to unlock 的聚光动画文字效果

Qt qml 模拟iphone slide to unlock 的聚光动画文字效果 模拟iphone slide to unlock 的聚光动画文字效果     /底层放淡文字     /前...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)