CAEmitterLayer看上去像是许多CAEmitterCell的容器，这些CAEmitierCell定义了一个例子效果。你将会为不同的例子效果定义一个或多个CAEmitterCell作为模版，同时CAEmitterLayer负责基于这些模版实例化一个粒子流。一个CAEmitterCell类似于一个CALayer：它有一个contents属性可以定义为一个CGImage，另外还有一些可设置属性控制着表现和行为。我们不会对这些属性逐一进行详细的描述，你们可以在CAEmitterCell类的头文件中找到。
GitHub项目地址在CAAnimation_CAEmitterLayer工程里面的viewController里
下面是对CAEmitterLayer和CAEmitterCell的一些属性说明：
1、CAEmitterLayer
//装着CAEmitterCell对象的数组，被用于把粒子投放到layer上
@property(nullable, copy) NSArray<CAEmitterCell *> *emitterCells;
//粒子产生系数，默认1.0
@property float birthRate;
//粒子生命周期
@property float lifetime;
//发射位置
@property CGPoint emitterPosition;
//发射源的z坐标位置
@property CGFloat emitterZPosition;
//发射源的大小
@property CGSize emitterSize;
//决定粒子形状的深度联系：emitter shape
@property CGFloat emitterDepth;
//发射源的形状
@property(copy) NSString *emitterShape;
- 取值
NSString * const kCAEmitterLayerPoint;
NSString * const kCAEmitterLayerLine;
NSString * const kCAEmitterLayerRectangle;
NSString * const kCAEmitterLayerCuboid;
NSString * const kCAEmitterLayerCircle;
NSString * const kCAEmitterLayerSphere;
//发射模式
@property(copy) NSString *emitterMode;
- 取值
NSString * const kCAEmitterLayerPoints;
NSString * const kCAEmitterLayerOutline;
NSString * const kCAEmitterLayerSurface;
NSString * const kCAEmitterLayerVolume;
//渲染模式
@property(copy) NSString *renderMode;
- 取值
NSString * const kCAEmitterLayerUnordered;
NSString * const kCAEmitterLayerOldestFirst;
NSString * const kCAEmitterLayerOldestLast;
NSString * const kCAEmitterLayerBackToFront;
NSString * const kCAEmitterLayerAdditive;
//粒子是否平展在层上
@property BOOL preservesDepth;
//粒子速度
@property float velocity;
//粒子的缩放比例
@property float scale;
//自旋转速度
@property float spin;
//用于初始化随机数产生的种子
@property unsigned int seed;
2、CAEmitterCell的属性
//初始化方法
+ (instancetype)emitterCell;
//根据健 获 得 值
+ (nullable id)defaultValueForKey:(NSString *)key;
//是否 归 档莫 键值
- (BOOL)shouldArchiveValueForKey:(NSString *)key;
//粒子的名字
@property(nullable, copy) NSString *name;
//粒子是否被渲染
@property(getter=isEnabled) BOOL enabled;
//粒子参数的速度乘数因子
@property float birthRate;
//生命周期
@property float lifetime;
//生命周期范围
@property float lifetimeRange;
//发射的 z 轴方向的角度
@property CGFloat emissionLatitude;
//x-y 平面的 发 射方向
@property CGFloat emissionLongitude;
//周 围发射角度
@property CGFloat emissionRange;
//速度
@property CGFloat velocity;
//速度范围
@property CGFloat velocityRange;
//粒子 x 方向的加速度分量
@property CGFloat xAcceleration;
//粒子 y 方向的加速度分量
@property CGFloat yAcceleration;
//粒子 z 方向的加速度分量
@property CGFloat zAcceleration;
//缩放比例
@property CGFloat scale;
//缩放比例范围
@property CGFloat scaleRange;
//缩放比例速度
@property CGFloat scaleSpeed;
//子旋转角度
@property CGFloat spin;
//子旋转角度范围
@property CGFloat spinRange;
//粒子的颜色
@property(nullable) CGColorRef color;
//一个粒子的 颜 色 red 能改 变 的范 围
@property float redRange;
//一个粒子的 颜 色 green 能改 变 的范 围
@property float greenRange;
//一个粒子的 颜 色 blue 能改 变 的范 围
@property float blueRange;
//一个粒子的 颜 色 alpha 能改 变 的范 围
@property float alphaRange;
//粒子 red 在生命周期内的改变速度
@property float redSpeed;
//粒子 green 在生命周期内的改变速度
@property float greenSpeed;
//粒子 blue 在生命周期内的改变速度
@property float blueSpeed;
//粒子透明度在生命周期内的改变速度
@property float alphaSpeed;
//是个 CGImageRef 的对象 , 既粒子要展现的图片
@property(nullable, strong) id contents;
//应该画在 contents 里的子 rectangle
@property CGRect contentsRect;
//定义了寄宿图的像素尺寸和视图大小的比例，默认情况下它是一个值为1.0的浮点数
@property CGFloat contentsScale;
//减小自己的大小
@property(copy) NSString *minificationFilter;
//不是很清楚好像增加自己的大小
@property(copy) NSString *magnificationFilter;
//减小大小的因子
@property float minificationFilterBias;
//粒子发射的粒子
@property(nullable, copy) NSArray<CAEmitterCell *> *emitterCells;
//类似于层的继承的属性(不是很清楚)
@property(nullable, copy) NSDictionary *style;
1、下雨效果
rain.gif
实现代码：
/**
* 心形雨
*/
private func setUpRainEmitterLayer(){
rainEmitterLayer = CAEmitterLayer()
//渲染模式
rainEmitterLayer.renderMode = kCAEmitterLayerOldestFirst;
//发射模式，为线性边缘
rainEmitterLayer.emitterMode = kCAEmitterLayerOutline;
//发射源的形状，线性的(就是一条线上都可以发射粒子)
rainEmitterLayer.emitterShape = kCAEmitterLayerLine;
//设置发射源的位置
rainEmitterLayer.emitterPosition = CGPoint(x: view.bounds.midX, y: 0)
//设置发射源的范围
rainEmitterLayer.emitterSize = CGSize(width: view.bounds.width, height: 0)
//设置动画默认停止
rainEmitterLayer.birthRate = 0
//初始化CAEmitterCell
let cell = CAEmitterCell()
//设置cell的内容
cell.contents = #imageLiteral(resourceName: "Heart_red").cgImage
//设置scale的系数
cell.scale = 0.1
//设置周期时间（每个粒子在屏幕中持续的时间）
cell.lifetime = 5
//设置粒子数
cell.birthRate = 1000
//设置粒子加速度
cell.velocity = 500
//设置发射方向(x-y屏面)
cell.emissionLongitude = CGFloat.pi
//设置粒子cell
rainEmitterLayer.emitterCells = [cell]
self.view.layer.addSublayer(rainEmitterLayer)
}
rain按钮点击事件：
@IBAction func rainButtonClick(_ sender: UIButton) {
sender.isUserInteractionEnabled = false
//设置动画
let rainAnimation = CABasicAnimation(keyPath: "birthRate")
rainAnimation.duration = 3.0
if rainEmitterLayer.birthRate == 0 {
rainAnimation.fromValue = 0
rainAnimation.toValue = 1
rainEmitterLayer.birthRate = 1
}else{
rainAnimation.fromValue = 1
rainAnimation.toValue = 0
rainEmitterLayer.birthRate = 0
}
rainEmitterLayer.add(rainAnimation, forKey: "birthRate")
DispatchQueue.main.asyncAfter(deadline: .now() + rainAnimation.duration) {
[weak self] in
/*
guard语句和if语句有点类似，都是根据其关键字之后的表达式的布尔值决定下一步执行什么。但与if语句不同的是，guard语句只会有一个代码块，不像if语句可以if else多个代码块。
那么guard语句的作用到底是什么呢？顾名思义，就是守护。guard语句判断其后的表达式布尔值为false时，才会执行之后代码块里的代码，如果为true，则跳过整个guard语句
*/
guard self != nil else{return}
sender.isUserInteractionEnabled = true
}
}
2、上升心形动画
上升心形动画.gif
代码实现：
/**
* 曲线上升心形动画效果
*/
private func setUpRightHeartLayer(){
//设置rightHeartLayer
rightHeartLayer = CAEmitterLayer()
//设置发射源的形状
rightHeartLayer.emitterMode = kCAEmitterLayerPoint
//设置发射源的发射模式
// rightHeartLayer.emitterShape = kCAEmitterLayerVolume
//设置渲染模式
rightHeartLayer.renderMode = kCAEmitterLayerOldestFirst
//设置发射源的位置
rightHeartLayer.emitterPosition = rightHeartButton.center
//设置birthRate
rightHeartLayer.birthRate = 0
//初始化CAEmitterLayer
let cell = CAEmitterCell()
//设置cell的contents
cell.contents = #imageLiteral(resourceName: "Heart_red").cgImage
//设置粒子数
cell.birthRate = 5
//设置周期时间
cell.lifetime = 1
//设置cell的scale系数
cell.scale = 0.5
//设置scale的speed系数
// cell.scaleSpeed = -0.1
//设置alpha的speed系数
cell.alphaSpeed = -1
//设置粒子速度
cell.velocity = 50
//设置粒子发射角度
cell.emissionLongitude = -CGFloat.pi/2
cell.emissionRange = CGFloat.pi/4
rightHeartLayer.emitterCells = [cell]
self.view.layer.addSublayer(rightHeartLayer)
}
右侧心形按钮的点击方法
@IBAction func rightHeartButtonClick(_ sender: UIButton) {
sender.isUserInteractionEnabled = false
//设置时间参数
rightHeartLayer.beginTime = CACurrentMediaTime()
/*所有的cells是在一定时间里面生成的，并不是同一时刻生成的，所以如果设置的延迟时间过少的话，cells有可能没有或者只有一两个，这里要注意*/
rightHeartLayer.birthRate = 1
DispatchQueue.main.asyncAfter(deadline: .now() + 1) {[weak self] in
guard let strongSelf = self else {return}
strongSelf.rightHeartLayer.birthRate = 0
}
DispatchQueue.main.asyncAfter(deadline: .now() + 1.6) {[weak self] in
guard self != nil else {return}
sender.isUserInteractionEnabled = true
}
}
3、粒子放射效果
粒子放射效果.gif
代码实现：
/**
* 粒子放射效果
*/
private func setUpCenterHeartLayer(){
//设置centerHeartLayer
centerHeartLayer = CAEmitterLayer()
//设置发射源粒的形状
centerHeartLayer.emitterShape = kCAEmitterLayerCircle
//设置发射粒子的模式
centerHeartLayer.emitterMode = kCAEmitterLayerOutline
//设置渲染效果
centerHeartLayer.renderMode = kCAEmitterLayerOldestFirst
//设置发射源的位置
centerHeartLayer.emitterPosition = centerHeartButton.center
//设置发射源的大小
centerHeartLayer.emitterSize = centerHeartButton.bounds.size
centerHeartLayer.birthRate = 0
//设置CAEmitterCell
let cell = CAEmitterCell()
//设置cell的内容
cell.contents = #imageLiteral(resourceName: "Heart_red").cgImage
//设置周期时间
cell.lifetime = 1
//设置scale大小
cell.scale = 0.05
//设置粒子数
cell.birthRate = 2000
//设置scale的speed
cell.scaleSpeed = -0.02
//设置alpha的speed
cell.alphaSpeed = -1
//设置粒子的速度
cell.velocity = 30
centerHeartLayer.emitterCells = [cell]
self.view.layer.addSublayer(centerHeartLayer)
}
中间心形按钮点击事件：
@IBAction func centerHeartButtonClick(_ sender: UIButton) {
sender.isUserInteractionEnabled = false
//设置时间参数
centerHeartLayer.beginTime = CACurrentMediaTime()//在0.2秒后设置birthrate=0,这个0.2秒的时间内，cell只生成一部分，并没有2000个全部完成。
centerHeartLayer.birthRate = 1
DispatchQueue.main.asyncAfter(deadline: .now() + 0.2) {[weak self] in
guard let strongSelf = self else {return}
strongSelf.centerHeartLayer.birthRate = 0
}
DispatchQueue.main.asyncAfter(deadline: .now() + 1) {[weak self] in
guard self != nil else {return}
sender.isUserInteractionEnabled = true
}
}
4、烟花效果
烟花效果.gif
代码实现：
private func setUpGratilyEmitterLayer(layer:CAEmitterLayer!,point:CGPoint!,angle:CGFloat!,angleRange:CGFloat!){
//设置发射源的形状
layer.emitterMode = kCAEmitterLayerPoint
//设置发射源的发射模式
layer.emitterMode = kCAEmitterLayerVolume
//设置渲染模式
layer.renderMode = kCAEmitterLayerOldestFirst
//设置发射源的位置
layer.emitterPosition = point
//设置birthRate
layer.birthRate = 0
//初始化红❤️EmitterCell
let redCell = CAEmitterCell()
//设置cell的contents
redCell.contents = #imageLiteral(resourceName: "Heart_red").cgImage
//设置cell的scale
redCell.scale = 0.5
//设置alpha
redCell.alphaSpeed = -0.1
//设置周期时间
redCell.lifetime = 20
//设置粒子速度
redCell.velocity = 100
//设置粒子个数
redCell.birthRate = 10
//设置Y轴方向的分支速度
redCell.yAcceleration = 20
//设置发射角度
redCell.emissionLongitude = angle
/*设置发射角度的浮动值(这个浮动值是基于emissionLongitude的角度位置的，比如
emissionLongitude是CGFloat.pi/4,emissionRange为CGFloat.pi/4，则发射点发射
角度浮动范围就在CGFloat.pi/4-CGFloat.pi/8到 CGFloat.pi/4 + CGFloat.pi/8)*/
redCell.emissionRange = angleRange
//粒子自旋角度
redCell.spin = 0
//粒子自旋角度浮动值
redCell.spinRange = CGFloat.pi * 2
//初始化蓝❤️EmitterCell
let blueCell = CAEmitterCell()
//设置cell的contents
blueCell.contents = #imageLiteral(resourceName: "Heart_blue").cgImage
//设置scale
blueCell.scale = 0.5
//设置周期时间
blueCell.lifetime = 20
//设置粒子数
blueCell.birthRate = 5
//设置粒子速度
blueCell.velocity = 130
//设置alpha
blueCell.alphaSpeed = -0.1
//设置Y轴的分支速度
blueCell.yAcceleration = 20
//设置发射角度
blueCell.emissionLongitude = angle
//设置发射角度浮动值
blueCell.emissionRange = angleRange
//设置自旋角度
blueCell.spin = 0
//设置自旋角度浮动值
blueCell.spinRange = CGFloat.pi * 2
layer.emitterCells = [redCell,blueCell]
view.layer.addSublayer(layer)
}
gravity按钮点击事件：
@IBAction func gravityButtonClick(_ sender: UIButton) {
sender.isUserInteractionEnabled = false
leftGravityLayer.beginTime = CACurrentMediaTime()
rightGravityLayer.beginTime = CACurrentMediaTime()
leftGravityLayer.birthRate = 1
rightGravityLayer.birthRate = 1
DispatchQueue.main.asyncAfter(deadline: .now() + 10) {[weak self] in
guard let strongSelf = self else {return}
strongSelf.leftGravityLayer.birthRate = 0
strongSelf.rightGravityLayer.birthRate = 0
}
DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {[weak self] in
guard self != nil else {return}
sender.isUserInteractionEnabled = true
}
}
}
一些自己研究过程中遇到比较难解的问题在代码中已经注释了。
网友评论