CAEmitterLayer（粒子系统）学习笔…

一、系统剖析

在UIKit中，粒子系统由两部分组成：

·      一个或多个CAEmitterCells：发射器电池可以看作是单个粒子的原型（例如，一个单一的粉扑在一团烟雾）。当散发出一个粒子，UIKit根据这个发射粒子和定义的基础上创建一个随机粒子。此原型包括一些属性来控制粒子的图片，颜色，方向，运动，缩放比例和生命周期。

·      一个或多个CAEmitterLayers，但通常只有一个：这个发射的层主要控制粒子的形状（例如，一个点，矩形或圆形）和发射的位置（例如，在矩形内，或边缘）。这个层具有全局的乘法器，可以施加到系统内的CAEmitterCells。这些给你一个简单的方法覆盖的所有粒子的变化。比如一个人为的例子将改变x雨来模拟风的速度。

基础是简单的，但这些参数却是相当微妙的。CAEmitterLayer有超过30种不同的参数进行自定义粒子的行为。下面，我就拼出来的一些特殊问题

二、不可测性

1、是什么让粒子系统成为一个随机的系统？

CAEmitterCell的属性一般有两个参数：一个均值和一个“cone”，比如velocity 和velocityRange。

默认情况下，这个“cone”是0，这就以为着所有粒子将具有相同的速度。通过改变这个“cone”,每个发射粒子会随机被扰动获得一个这个“cone”范围内的值。这点在Apple官方文档CAEmitterLayerdocumentation:  有讲解：

Each layer has its ownrandom number generator state. Emitter cellproperties that are defined as amean and a range, such as a cell’sspeed, the value of the properties areuniformly distributed in theinterval [M - R/2, M + R/2].

2、发射的方向

CAEmitterCells有一个velocity（速度）的属性，这意味着发送方向上的速度。实际上这个发射的方向是通过emissionLongitude属性定义的。Apple这样阐述的：

The emission longitude is theorientation of the emission angle inthe xy-plane. it is also often referred toas theazimuth.

三、代码

[plain] view plaincopy

1. - (void)viewDidLoad  
2. {  
3.     [super viewDidLoad];  
4.    
5.     CAEmitterLayer *emitterLayer = [CAEmitterLayer layer];  
6.     emitterLayer.emitterPosition = self.view.center;  
7.     _emitterLayer = emitterLayer;  
8.     [self.view.layer addSublayer:emitterLayer];  
9.       
10.     CAEmitterCell *funnyEmitterCell = [CAEmitterCell emitterCell];  
11.     funnyEmitterCell.contents = (id)[UIImage imageNamed:@"funny.jpg"].CGImage;  
12.     funnyEmitterCell.birthRate = 10.0;  
13.     funnyEmitterCell.velocity = 200.0;  
14.     funnyEmitterCell.lifetime = 5.0;  
15.     funnyEmitterCell.scale = 0.1;  
16.     funnyEmitterCell.name = @"funny";  
17.     emitterLayer.emitterCells = [NSArray arrayWithObject:funnyEmitterCell];  
18.     [self bumpAngle];  
19.       
20.     UILabel *angleLabel = [[UILabel alloc] initWithFrame:CGRectMake(20, 20, 100, 30)];  
21.     angleLabel.backgroundColor = [UIColor clearColor];  
22.     [self.view addSubview:angleLabel];  
23.     _angleLabel = angleLabel;  
24. }  
25.    
26. - (void) bumpAngle {  
27.     NSNumber *emissionLongitude = [_emitterLayer valueForKeyPath:@"emitterCells.funny.emissionLongitude"];  
28.     NSNumber *nextLongitude = [NSNumber numberWithFloat:[emissionLongitude floatValue] + 0.02];  
29.     [_emitterLayer setValue:nextLongitude forKeyPath:@"emitterCells.funny.emissionLongitude"];  
30.     _angleLabel.text = [NSString stringWithFormat:@"%.0f degrees", [nextLongitude floatValue] * 180 / M_PI];  
31.    [self performSelector:@selector(bumpAngle) withObject:nil afterDelay:0.1];  
32. }  
33.    

代码设置/结构说明：

1、CAEmitterCell

CAEmitterCell ＊effectCell = [CAEmitterCellemitterCell];

effectCell 几个重要属性：

1）.birthRate 顾名思义没有这个也就没有effectCell，这个必须要设置，具体含义是每秒某个点产生的effectCell数量

2）.lifetime & lifetimeRange表示effectCell的生命周期，既在屏幕上的显示时间要多长。

3）.contents 这个和CALayer一样，只是用来设置图片

4）.name 这个是当effectCell存在caeEmitter 的emitterCells中用来辨认的。用到setValueforKeyPath比较有用

5）.velocity & velocityRange & emissionRange表示cell向屏幕右边飞行的速度 & 在右边什么范围内飞行& ＋－角度扩散

6）.把cell做成array放进caeEmitter.emitterCells里去。caeEmitter.renderMode有个效果很不错，能变成火的就是kCAEmitterLayerAdditive

属性：

alphaRange:  一个粒子的颜色alpha能改变的范围；

alphaSpeed:粒子透明度在生命周期内的改变速度；

birthrate：粒子参数的速度乘数因子；

blueRange：一个粒子的颜色blue 能改变的范围；

blueSpeed: 粒子blue在生命周期内的改变速度；

color:粒子的颜色

contents：是个CGImageRef的对象,既粒子要展现的图片；

contentsRect：应该画在contents里的子rectangle：

emissionLatitude：发射的z轴方向的角度

emissionLongitude:x-y平面的发射方向

emissionRange；周围发射角度 

emitterCells：粒子发射的粒子

enabled：粒子是否被渲染

greenrange: 一个粒子的颜色green 能改变的范围；

greenSpeed: 粒子green在生命周期内的改变速度；

lifetime：生命周期

lifetimeRange：生命周期范围

magnificationFilter：不是很清楚好像增加自己的大小

minificatonFilter：减小自己的大小

minificationFilterBias：减小大小的因子

name：粒子的名字

redRange：一个粒子的颜色red 能改变的范围；

redSpeed; 粒子red在生命周期内的改变速度；

scale：缩放比例：

scaleRange：缩放比例范围；

scaleSpeed：缩放比例速度：

spin：子旋转角度

spinrange：子旋转角度范围

style：不是很清楚：

velocity：速度

velocityRange：速度范围

xAcceleration:粒子x方向的加速度分量

yAcceleration:粒子y方向的加速度分量

zAcceleration:粒子z方向的加速度分量

2、CAEmitterLayer

CAEmitterLayer提供了一个基于CoreAnimation的粒子发射系统，粒子用CAEmitterCell来初始化。粒子画在背景层盒边界上

属性:   

birthRate:粒子产生系数，默认1.0；

emitterCells: 装着CAEmitterCell对象的数组，被用于把粒子投放到layer上；

emitterDepth:决定粒子形状的深度联系：emittershape

emitterMode:发射模式

NSString * const kCAEmitterLayerPoints;

NSString * const kCAEmitterLayerOutline;

NSString * const kCAEmitterLayerSurface;

NSString * const kCAEmitterLayerVolume;

emitterPosition:发射位置

emitterShape:发射源的形状：

NSString * const kCAEmitterLayerPoint;

NSString * const kCAEmitterLayerLine;

NSString * const kCAEmitterLayerRectangle;

NSString * const kCAEmitterLayerCuboid;

NSString * const kCAEmitterLayerCircle;

NSString * const kCAEmitterLayerSphere;

emitterSize:发射源的尺寸大；

emitterZposition:发射源的z坐标位置；

lifetime:粒子生命周期

preservesDepth:不是多很清楚（粒子是平展在层上）

renderMode:渲染模式：

NSString * const kCAEmitterLayerUnordered;

NSString * const kCAEmitterLayerOldestFirst;

NSString * const kCAEmitterLayerOldestLast;

NSString * const kCAEmitterLayerBackToFront;

NSString * const kCAEmitterLayerAdditive;

 

scale:粒子的缩放比例：

seed：用于初始化随机数产生的种子

spin:自旋转速度

velocity：粒子速度

iOS粒子系统CAEmitterLayer效果

开始iOS的动效学习，一开始只对普通的CALayer有所了解，偶然的机会想到做一些全局的飘洒的效果。当时采用最笨的方法通过不断的创建CALayer结合UIView来实现动画，效果其实还行。后来了解到CAEmitterLayer这个iOS系统下的粒子系统。

　　CAEmitterLayer这个CALayer需要设置的参数特别的多，每一种参数都会产生特定的效果，这里自己摸索了下，记录下来，最后做了个飘洒圆形图片的效果。

 

　　CAEmitterLayer的创建主要包括两部分：CAEmitterLayer、CAEmitterCell，然后将其关联起来就可以了CAEmitterLayer.emitterCells= @[CAEmitterCell]，基本代码结构如下：

　　其实这段代码就是我们创建上面飘落效果的代码，看吧，我们需要做的事情就是为了达到所想要的效果而不停的调整设置。那么我们需要理解的关键就在于理解里面的各个字段，对每个字段的改变所达到的效果有个了解。

　　

　　下面我们列举下所设置的参数以及其对应的效果

　　Layer相关：

　　position:发射位置              

　　CGPointMake(self.view.bounds.size.width,0)          CGPointMake(self.view.bounds.size.width / 2,0)  

           

　　

　　emitterSize：发射源的尺寸大小，其实这个emitterSize结合position构建了发射源的位置及大小的矩形区域rect

　　emitterShape：发射源的形状，这个字段规定了发射源的形状

　　　　　　kCAEmitterLayerPoint：点形状，发射源的形状就是一个点，位置在上面position设置的位置

　　　　　　kCAEmitterLayerLine：线形状，发射源的形状是一条线，位置在rect的横向的位于垂直方向中间那条

　　　　　　kCAEmitterLayerRectangle：矩形状，发射源是一个矩形，就是上面生成的那个矩形rect

　　　　　　kCAEmitterLayerCuboid：立体矩形形状，发射源是一个立体矩形，这里要生效的话需要设置z方向的数据，如果不设置就同矩形状

　　　　　　kCAEmitterLayerCircle：圆形形状，发射源是一个圆形，形状为矩形包裹的那个圆，二维的

　　　　　　kCAEmitterLayerSphere：立体圆形，三维的圆形，同样需要设置z方向数据，不设置则通二维一样

　　emitterMode：发射模式，这个字段规定了在特定形状上发射的具体形式是什么

　　　　　　kCAEmitterLayerPoints：点模式，发射器是以点的形势发射粒子。

　　　　　　如果发射形状为：kCAEmitterLayerPoint，则发射效果为在发射点发射粒

　　　　　　如果发射形状为：kCAEmitterLayerLine，则发射效果为在直线两端都进行粒子的发射

　　　　　　如果发射形状为：kCAEmitterLayerRectangle，则发射效果为矩形的四个角

　　　　　　如果发射形状为：kCAEmitterLayerCircle，则发射效果同kCAEmitterLayerPoint一样

　　kCAEmitterLayerOutline: 这个模式下整个边框都是发射点，即边框进行发射

　　　　　　如果发射形状为kCAEmitterLayerPoint：效果就还是一个点进行发射

　　　　　　如果发射形状为kCAEmitterLayerLine：效果就是哪条直线进行抛洒

　　　　　　如果发射形状为kCAEmitterLayerRectangle：效果就是沿着那个矩形框的边框进行发射

　　　　　　如果发射形状为kCAEmitterLayerCircle：效果就是沿着那个圆形的边框进行发射

　　　　　　效果依次如下所示：

                        

                    

 

　　kCAEmitterLayerSurface：这个模式下是我们边框包含下的区域进行抛洒

　　　　　　如果发射形状为kCAEmitterLayerPoint：效果就还是一个点进行发射

　　　　　　如果发射形状为kCAEmitterLayerLine：效果就是哪条直线进行抛洒

　　　　　　如果发射形状为kCAEmitterLayerRectangle：效果就是沿着那个矩形框的内部区域中进行发射

　　　　　　如果发射形状为kCAEmitterLayerCircle：效果就是沿着那个圆形的边框包含的区域中进行发射

　　　　　　效果依次如下所示：

                    

                    

　　

　　kCAEmitterLayerVolume:这个的效果和kCAEmitterLayerSurface很像

 

　　上面介绍了Layer方面发射形状、发射位置、发射模式的探索，从上面能够大致构建自己想要的发射形状。下面我们就要探索抛洒的元素了CAEmitterCell相关的属性来构建我们想要抛洒的对象。

 　　contents：cell的内容，一般使用图片，可以采用已有的或者自己绘制都可。

 　　birthRate：出生率，这个就是代表每秒有多少个对象生成。

 　　lifetime：生存时间，这个代表对象能够存活的时间

 　　lifetimeRange：生存时间浮动，这个代表生存时间会在这个数字内浮动。比如lifetime= 10s, lifetimeRange = 5s那么实际的每个cell的lifetime = [5s -15s]。

 

      velocity：运动速度，这个代表粒子在抛洒中的运动速度

　　velocityRange：运动速度的浮动数字。同lifetimeRange的作用一样，保证了每个粒子能够有个随机的速度值

      yAcceleration：Y方向的加速度，这个可以模拟地球上的重力加速度，值越大则每个粒子下落的越快

     velocity=40.f;yAcceleration=15.f  所有的对象都匀速运动，而且y方向有个不断偏移的过程

　　velocity=40.f; velocityRange=100.f;yAcceleration=80.f  所有对象的速度不恒定了，且沿着y方向的偏移越发厉害了

 

　　emissionLongitude：抛洒的角度，就是指定cell从什么方向进行抛洒

　　emissionRange: 抛洒角度的浮动角度，这个角度指定了抛洒出的对象能够在多大角度范围内扩散。

     　　emissionLongitude=M_PI; emissionRange=M_PI_4

　　　　emissionLongitude=0; emissionRange=M_PI_2

       

 

　　scale: 对象的初始缩放大小

　　scaleRange：对象的缩放扰动范围

　　scaleSpeed: 对象缩放的速度

 

　　alphaRange：对象的透明度扰动范围

　　alphaSpeed：对象的透明度的变动速度

 

　　color：对象的颜色，这里我们的cell可以对图片从新进行颜色的填充，所以如果对于我们设计的一个单色的图片来说，这个字段将很有用

　　redRange：红色通道的扰动范围

　　greenRange：绿色通道的扰动范围

　　blueRange：蓝色通道的扰动范围

　　redSpeed：红色颜色的变更速度

　　greenSpeed：绿色颜色的变更速度

　　blueSpeed：蓝色颜色的变更速度

　　我们通过上面的设置，可以产生随机的颜色数值，正如我们实例中所示的那样。需要注意的是如果我们设置了redSpeed、greenSpeed、blueSpeed的话，对象的最后颜色可能变为了白色或者黑色。

     redSpeed=.2f; greenSpeed=.2f; blueSpeed=.2f;可以看到对象会很快的失去光泽。

　　

 

　　当然你可以对这些Layer进行动画，譬如position, scale, birthRate等等。譬如以下代码就是让他的position随着touch移动，以及对scale做了动画效果。代码如下：

　　而他的运行效果如下：

下载Demo地址：https://app.yinxiang.com/shard/s70/nl/2147483647/b8641890-df9c-4bef-b66e-716ca8fb324d/