Cocos2d-JS内置粒子系统

Cocos2d-JS内置粒子系统,第1张

概述从类图中我们可以看到,Cocos2d-JS中有内置的11种粒子,这些粒子的属性都是预先定义好的,我们也可以在程序代码中单独修改某些属性,我们在上一节的实例中都已经实现了这些属性的设置。 内置粒子系统 内置的11种粒子系统说明如下:  ParticleExplosion。爆炸粒子效果,属于半径模式。 ParticleFire。火焰粒子效果,属于重力径模式。 ParticleFireworks。烟花粒 从类图中我们可以看到,Cocos2d-Js中有内置的11种粒子,这些粒子的属性都是预先定义好的,我们也可以在程序代码中单独修改某些属性,我们在上一节的实例中都已经实现了这些属性的设置。
内置粒子系统
内置的11种粒子系统说明如下:
ParticleExplosion。爆炸粒子效果,属于半径模式。
ParticleFire。火焰粒子效果,属于重力径模式。
ParticleFireworks。烟花粒子效果,属于重力模式。
ParticleFlower。花粒子效果,属于重力模式。
Particlegalaxy。星系粒子效果,属于半径模式。
ParticleMeteor。流星粒子效果,属于重力模式。
ParticleSpiral。漩涡粒子效果,属于半径模式。
ParticleSNow。雪粒子效果,属于重力模式。
ParticleSmoke。烟粒子效果,属于重力模式。
ParticleSun。太阳粒子效果,属于重力模式。
ParticleRain。雨粒子效果,属于重力模式。
这11种粒子的属性,根据它的发射模式不同,效果不同。
实例:内置粒子系统
下面我们通过一个实例演示一下这11种内置粒子系统。这个实例如图所示,左图是一个 *** 作菜单场景,选择菜单可以进入到上图动作场景,在下图动作场景中演示选择的粒子系统效果,点击右下角返回按钮可以返回到菜单场景。

内置粒子系统实例 下面我们重点介绍一下场景MyActionScene,它的MyActionScene.Js代码如下:
var MyActionLayer = cc.Layer.extend({    flagTag: 0,//  *** 作标志    pLabel: null,①    ctor: function (flagTag) {             this._super();        this.flagTag = flagTag;        cc.log("MyActionLayer init flagTag " + this.flagTag);        var size = cc.director.getWinSize();        var backMenuItem = new cc.LabelBMFont("<Back",res.fnt_fnt);        var backMenuItem = new cc.MenuItemLabel(backMenuItem,this.backMenu,this);        backMenuItem.x = size.wIDth - 100;        backMenuItem.y = 100;        var mn = cc.Menu.create(backMenuItem);        mn.x = 0;        mn.y = 0;        mn.anchorX = 0.5;        mn.anchorY = 0.5;        this.addChild(mn);        this.pLabel =  new cc.LabelBMFont("",res.fnt_fnt);        this.pLabel.x = size.wIDth /2;        this.pLabel.y = size.height  - 50;        this.addChild(this.pLabel,3);        return true;    },backMenu: function (sender) {        cc.director.popScene();    },onEnterTransitionDIDFinish: function () {        cc.log("Tag = " + this.flagTag);        var sprite = this.getChildByTag(SP_TAG);        var size = cc.director.getWinSize();       var system;        switch (this.flagTag) {											②            case ActionTypes.kExplosion:                system = new cc.ParticleExplosion();                this.pLabel.setString("Explosion");                break;            case ActionTypes.kFire:                system = new cc.ParticleFire();							system.texture = cc.textureCache.addImage(res.s_fire);				③                this.pLabel.setString("Fire");                break;            case ActionTypes.kFireworks:                system = new cc.ParticleFireworks();                this.pLabel.setString("Fireworks");                break;            case ActionTypes.kFlower:                system = new cc.ParticleFlower();                this.pLabel.setString("Flower");                break;            case ActionTypes.kgalaxy:                system = new cc.Particlegalaxy();                this.pLabel.setString("galaxy");                break;            case ActionTypes.kMeteor:                system = new cc.ParticleMeteor();                this.pLabel.setString("Meteor");                break;            case ActionTypes.kRain:                system = new cc.ParticleRain();                this.pLabel.setString("Rain");                break;            case ActionTypes.kSmoke:                system = new cc.ParticleSmoke();                this.pLabel.setString("Smoke");                break;            case ActionTypes.kSNow:                system = new cc.ParticleSNow();                this.pLabel.setString("SNow");                break;            case ActionTypes.kSpiral:                system = new cc.ParticleSpiral();                this.pLabel.setString("Spiral");                break;            case ActionTypes.kSun:                system = new cc.ParticleSun();                this.pLabel.setString("Sun");                break;													④        }        system.x = size.wIDth /2;        system.y = size.height /2;        this.addChild(system);    }});var MyActionScene = cc.Scene.extend({    onEnter: function () {        this._super();    }});


在头文件中第①行代码定义了LabelBMFont类型的成员变量pLabel,用来在场景中显示粒子系统的名称。
我们在MyActionLayer的onEnterTransitionDIDFinish函数中创建粒子系统对象,而不是在MyActionLayer的onEnter函数创建,这是因为MyActionLayer的onEnter函数调用时,场景还没有显示,如果在该函数中创建爆炸等显示一次的粒子系统,等到场景显示的时候,爆炸已经结束了,我们会看不到效果。
代码第②~④行创建了11种粒子系统,这里创建粒子系统时候都采用了它们的默认属性值。其中this.pLabel.setString("XXX")函数是为场景中标签设置内容,这样在进入场景后可以看到粒子系统的名称。

另外,如果在Web浏览器中运行还需要为粒子系统添加纹理,我们只在代码第③行添加了火粒子纹理,其它的粒子纹理添加类似。


更多内容请关注最新Cocos图书《 Cocos2d-x实战:Js卷——Cocos2d-Js开发本书交流讨论网站:http://www.cocoagame.net
欢迎加入Cocos2d-x技术讨论群:257760386
更多精彩视频课程请关注智捷课堂Cocos课程:http://v.51work6.com
智捷课堂现推出Cocos会员,敬请关注: http://v.51work6.com/courseInfoRedirect.do?action=netDetialInfo&courseId=844465&amp;categoryId=0

《Cocos2d-x实战 Js卷》现已上线,各大商店均已开售:

京东:http://item.jd.com/11659698.html

欢迎关注智捷iOS课堂微信公共平台,了解最新技术文章、图书、教程信息
总结

以上是内存溢出为你收集整理的Cocos2d-JS内置粒子系统全部内容,希望文章能够帮你解决Cocos2d-JS内置粒子系统所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://www.outofmemory.cn/web/1053446.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-25
下一篇 2022-05-25

发表评论

登录后才能评论

评论列表(0条)

保存