Cocos2d-x中自定义粒子系统

除了使用Cocos2d-x的11种内置粒子系统外，我们还可以通过创建ParticleSystemQuad对象，并设置属性实现自定义粒子系统，通过这种方式完全可以实现我们说需要的各种效果的粒子系统。使用ParticleSystemQuad自定义粒子系统至少有两种方式可以实现：代码创建和plist文件创建。

代码创建

所谓代码创建就是完全通过代码方式实现，其中所有的属性全部是通过程序代码设置。这要求开发人员对于这些属性值非常熟悉，而且这种方式无法预览，只能通过程序运行看效果，调整，再运行看效果，再调整，因此比较麻烦。

要想实现如下图所示的下雪粒子系统，我们当然可以通过前面介绍的方式实现，但本节我们先介绍通过自定义粒子系统实现。

 

代码创建的下雪粒子系统，主要代码如下：

 

[html] view plaincopy

 

1. bool HelloWorld::init()  

2. {  

3. if ( !Layer::init() )  

4. {  

5. return false;  

6. }  

7.    

8. Size visibleSize = Director::getInstance()->getVisibleSize();  

9.    

10. auto bg = Sprite::create("background-1.png");  

11.    

12. bg->setPosition(Point(visibleSize.width/2, visibleSize.height /2));  

13. this->addChild(bg);  

14.    

15. auto particleSystem = ParticleSystemQuad::createWithTotalParticles(200);    ①  

16.    

17. //设置雪花粒子纹理图片  

18. particleSystem->setTexture(TextureCache::getInstance()->addImage("snow.png"));    ②  

19. //设置发射粒子的持续时间-1表示永远持续  

20. particleSystem->setDuration(-1);  

21. //设置粒子的重力方向   

22. particleSystem->setGravity(Point(0,-240));  

23.    

24. //设置角度以及偏差  

25. particleSystem->setAngle(90);   

26. particleSystem->setAngleVar(360);  

27.    

28. //设置径向加速度以及偏差  

29. particleSystem->setRadialAccel(50);  

30. particleSystem->setRadialAccelVar(0);  

31.    

32. //设置粒子的切向加速度以及偏差  

33. particleSystem->setTangentialAccel(30);  

34. particleSystem->setTangentialAccelVar(0);  

35.    

36. // 设置粒子初始化位置偏差  

37. particleSystem->setPosVar(Point(400,0));  

38.    

39. //设置粒子生命期以及偏差  

40. particleSystem->setLife(4);  

41. particleSystem->setLifeVar(2);  

42.    

43. //设置粒子开始时候旋转角度以及偏差  

44. particleSystem->setStartSpin(30);  

45. particleSystem->setStartSpinVar(60);  

46.    

47. //设置结束时候的旋转角度以及偏差  

48. particleSystem->setEndSpin(60);  

49. particleSystem->setEndSpinVar(60);  

50.    

51. //设置开始时候的颜色以及偏差  

52. particleSystem->setStartColor(Color4F(1,1,1,1));  

53. //设置结束时候的颜色以及偏差  

54. particleSystem->setEndColor(Color4F(1,1,1,1));  

55.    

56. //设置开始时候粒子大小以及偏差  

57. particleSystem->setStartSize(30);  

58. particleSystem->setStartSizeVar(0);  

59.    

60. //设置粒子结束时候大小以及偏差  

61. particleSystem->setEndSize(20.0f);  

62. particleSystem->setEndSizeVar(0);  

63.    

64. //设置每秒钟产生粒子的数量  

65. particleSystem->setEmissionRate(100);  

66.    

67. particleSystem->setPosition(Point(visibleSize.width/2, visibleSize.height + 50));  

68.    

69. this->addChild(particleSystem);  

70.    

71.     return true;  

72. }  

 

 

上述第①行代码ParticleSystemQuad::createWithTotalParticles(200)是创建ParticleSystemQuad对象，静态createWithTotalParticles函数是通过指定初始粒子数来创建粒子对象。

第②行代码是指定粒子的纹理，TextureCache::getInstance()->addImage("snow.png")语句可以通过指定的纹理图片创建纹理对象Texture2D，贴图的纹理图片宽高必须是2的n次幂，大小不要超过64x64像素，在美工设计纹理图片时候，不用关注太多细节，例如：设计雪花纹理图片时候，按照雪花是有6个角的，很多人会设计为图10-7所示的样式，而事实上我们需要的图10-8所示的渐变效果的圆点。

雪花图片 

 

雪花粒子纹理图片

 

plist文件创建

代码创建方式要维护很多属性，要想手工调整这些属性那是非常困难的事情，我们推荐使用Particle Designer等粒子设计工具进行所见即所得的设计，这些工具一般会生成一个描述粒子的属性类表文件plist，然后通过类似下面的语句加载：

auto particleSystem =ParticleSystemQuad::create("snow.plist");

snow.plist是描述运动的属性文件，plist文件是一种XML文件，参考代码如下：

 

[html] view plaincopy

 

1. <?xml version="1.0" encoding="UTF-8"?>  

2. <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">  

3. <plist version="1.0">  

4. <dict>  

5. <key>angle</key>  

6. <real>270</real>  

7. <key>angleVariance</key>  

8. <real>5</real>  

9. <key>blendFuncDestination</key>  

10. <integer>771</integer>  

11. <key>blendFuncSource</key>  

12. <integer>1</integer>  

13. <key>duration</key>  

14. <real>-1</real>  

15. <key>emitterType</key>  

16. <real>0.0</real>  

17. <key>finishColorAlpha</key>  

18. <real>1</real>  

19. <key>finishColorBlue</key>  

20. <real>1</real>  

21. <key>finishColorGreen</key>  

22. <real>1</real>  

23. <key>finishColorRed</key>  

24. <real>1</real>  

25. <key>finishColorVarianceAlpha</key>  

26. <real>0.0</real>  

27. <key>finishColorVarianceBlue</key>  

28. <real>0.0</real>  

29. <key>finishColorVarianceGreen</key>  

30. <real>0.0</real>  

31. <key>finishColorVarianceRed</key>  

32. <real>0.0</real>  

33. <key>finishParticleSize</key>  

34. <real>-1</real>  

35. <key>finishParticleSizeVariance</key>  

36. <real>0.0</real>  

37. <key>gravityx</key>  

38. <real>0.0</real>  

39. <key>gravityy</key>  

40. <real>-10</real>  

41. <key>maxParticles</key>  

42. <real>700</real>  

43. <key>maxRadius</key>  

44. <real>0.0</real>  

45. <key>maxRadiusVariance</key>  

46. <real>0.0</real>  

47. <key>minRadius</key>  

48. <real>0.0</real>  

49. <key>minRadiusVariance</key>  

50. <real>0.0</real>  

51. <key>particleLifespan</key>  

52. <real>3</real>  

53. <key>particleLifespanVariance</key>  

54. <real>1</real>  

55. <key>radialAccelVariance</key>  

56. <real>0.0</real>  

57. <key>radialAcceleration</key>  

58. <real>1</real>  

59. <key>rotatePerSecond</key>  

60. <real>0.0</real>  

61. <key>rotatePerSecondVariance</key>  

62. <real>0.0</real>  

63. <key>rotationEnd</key>  

64. <real>0.0</real>  

65. <key>rotationEndVariance</key>  

66. <real>0.0</real>  

67. <key>rotationStart</key>  

68. <real>0.0</real>  

69. <key>rotationStartVariance</key>  

70. <real>0.0</real>  

71. <key>sourcePositionVariancex</key>  

72. <real>1200</real>  

73. <key>sourcePositionVariancey</key>  

74. <real>0.0</real>  

75. <key>speed</key>  

76. <real>130</real>  

77. <key>speedVariance</key>  

78. <real>30</real>  

79. <key>startColorAlpha</key>  

80. <real>1</real>  

81. <key>startColorBlue</key>  

82. <real>1</real>  

83. <key>startColorGreen</key>  

84. <real>1</real>  

85. <key>startColorRed</key>  

86. <real>1</real>  

87. <key>startColorVarianceAlpha</key>  

88. <real>0.0</real>  

89. <key>startColorVarianceBlue</key>  

90. <real>0.0</real>  

91. <key>startColorVarianceGreen</key>  

92. <real>0.0</real>  

93. <key>startColorVarianceRed</key>  

94. <real>0.0</real>  

95. <key>startParticleSize</key>  

96. <real>10</real>  

97. <key>startParticleSizeVariance</key>  

98. <real>5</real>  

99. <key>tangentialAccelVariance</key>  

100. <real>0.0</real>  

101. <key>tangentialAcceleration</key>  

102. <real>1</real>  

103. <key>textureFileName</key>  

104. <string>snow.png</string>  

105. </dict>  

106. </plist>  

 

 

在上述的plist文件描述的属性和属性值都是成对出现，其中<key>标签描述的是属性，<real>描述的属性值。plist文件是描述粒子的属性，使用的时候还需要有粒子纹理图片，plist文件中textureFileName属性指定了纹理图片，我们需要将plist文件和纹理图片放置到Resources目录下面。

提示 描述粒子属性的plist文件，可以通过粒子系统设计工具生成，有关粒子系统工具使用大家可以参考我的TODO。

 

如图所示的下雪实例，使用plist文件创建，主要代码如下：

 

[html] view plaincopy

 

1. bool HelloWorld::init()  

2. {  

3. if ( !Layer::init() )  

4. {  

5. return false;  

6. }  

7.    

8. Size visibleSize = Director::getInstance()->getVisibleSize();  

9.    

10. auto bg = Sprite::create("background-1.png");  

11. bg->setPosition(Point(visibleSize.width/2, visibleSize.height /2));  

12. this->addChild(bg);  

13.    

14. auto particleSystem = ParticleSystemQuad::create("snow.plist");  

15.     particleSystem->setPosition(Point(visibleSize.width/2, visibleSize.height - 50));  

16. this->addChild(particleSystem);  

17. return true;  

18. }  

 

 

从代码可见plist文件创建粒子系统要比代码创建简单很多，这主要是因为采用了plist描述粒子属性。

 

 

 

 

更多内容请关注国内第一本Swift图书《Swift开发指南》

本书交流讨论网站：http://www.51work6.com/swift.php

欢迎加入Swift技术讨论群：362298485

 

 

 

 

 

 

欢迎关注智捷iOS课堂微信公共平台

转载于:https://my.oschina.net/u/1410370/blog/313528