QQ和微信里面有个红包雨,苹果提供了一个非常方便的方法来实现:粒子发射器。
粒子发射器包括两个部分:发射器(CAEmitterLayer
)和粒子(CAEmitterCell
)。
这里以雪花效果为例:
代码如下所示:
CAEmitterCell *cell = [[CAEmitterCell alloc] init];
//展示的图片
cell.contents = (__bridge id _Nullable)([UIImage imageNamed:@"snow"].CGImage);
//每秒粒子产生个数的乘数因子,会和layer的birthRate相乘,然后确定每秒产生的粒子个数
cell.birthRate = 10;
//每个粒子存活时长
cell.lifetime = 10.0;
//粒子生命周期范围
cell.lifetimeRange = 0.3;
//粒子透明度变化,设置为-0.4,就是每过一秒透明度就减少0.4,这样就有消失的效果,一般设置为负数。
cell.alphaSpeed = -0.1;
cell.alphaRange = 0.01;
//粒子的速度
cell.velocity = 40;
//粒子的速度范围
cell.velocityRange = 20;
//粒子内容的颜色
cell.color = [[UIColor whiteColor] CGColor];
//设置了颜色变化范围后每次产生的粒子的颜色都是随机的
//cell.redRange = 0.5;
//cell.blueRange = 0.5;
//cell.greenRange = 0.5;
//缩放比例
cell.scale = 0.4;
//缩放比例范围
cell.scaleRange = 0.05;
cell.scaleSpeed = -0.01;//scale每秒变化率,负数缩小,正数放大
//粒子的初始发射方向
//emissionLongitude:抛洒的角度,x-y平面的发射方向;顺时针方向角度变化为0~PI/2~PI,逆时针变化是负的
cell.emissionLongitude = M_PI;
//cell.emissionLatitude = M_PI_4;
//emissionRange: 抛洒角度的浮动角度,这个角度指定了抛洒出的对象能够在多大角度范围内扩散。
//cell.emissionRange = M_PI_2;
//Y方向的加速度
cell.yAcceleration = 9.8;
_emitterLayer = [CAEmitterLayer layer];
_emitterLayer.backgroundColor = [UIColor redColor].CGColor;
//发射位置
_emitterLayer.emitterPosition = CGPointMake(SCREEN_WIDTH/2, 200);
//粒子产生系数,默认为1
_emitterLayer.birthRate = 1;
//发射器的尺寸
_emitterLayer.emitterSize = CGSizeMake(SCREEN_WIDTH, 0);
//发射的形状
_emitterLayer.emitterShape = kCAEmitterLayerLine;
//发射的模式
_emitterLayer.emitterMode = kCAEmitterLayerSurface;
//渲染模式
_emitterLayer.renderMode = kCAEmitterLayerOldestFirst;
_emitterLayer.masksToBounds = NO;
//_emitterLayer.zPosition = -1;
_emitterLayer.emitterCells = @[cell];
[self.view.layer addSublayer:_emitterLayer];
CAEmitterCell粒子单元
- contents : 一般放一张图片,是粒子要展示的内容 ;
- birthRate : 每秒粒子产生个数的乘数因子,会和layer的* birthRate相乘, 然后确定每秒产生的粒子个数;
- lifetimeRange : 所有的range属性都是你设置的属性值加减它后得到一个范围,例如cell.lifetime=5.0, cell.lifetimeRange = 1.0; 那么粒子的存活时间就是[4.0,6.0](也就是说lifetimeRange是和lifetime组合使用的);
- color : 粒子内容的颜色,更改后粒子会变色 ,默认不透明白色;
- redRange,blueRange,greenRange : 设置了颜色变化范围后会产生随机的颜色,这样粒子就会是五颜六色的了 ;
- scale : 粒子缩放比例,我们看到的烟花粒子就是缩放比例很小得到的,你可以用任意图,然后缩放比例设置很小,就可以得到很小的粒子;
- scaleRange : 缩放比例范围(类似lifetimeRange);
- scaleSpeed : scale每秒变化率,负数缩小,正数放大;
- emissionLongitude:抛洒的角度,x-y平面的发射方向;顺时针方向角度变化为0PI/2PI,逆时针变化是负的;
- emissionLatitude:发射的z轴方向的角度;
- emissionRange : 抛洒角度的浮动角度,这个角度指定了抛洒出的对象能够在多大角度范围内扩散;
- yAcceleration : Y方向的加速度
CAEmitterLayer发射器
- emitterCells : 粒子单元数组,你可以创建两个单元,负责不同的效果。
- emitterPosition : 在xy平面的发射位置
- emitterZPosition: z轴上的位置
- birthRate : 粒子产生系数,默认为1,想停下就设为0,这样就没有粒子产生了 (控制发射器开始与停止的开关)
- emitterSize : 发射器的尺寸
- emitterShape : 发射的形状,有6种值,分别是点、线、矩形、立方体、圆形、球形,如下代码所示。
/** `emitterShape' values. **/
CA_EXTERN NSString * const kCAEmitterLayerPoint
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//点
CA_EXTERN NSString * const kCAEmitterLayerLine
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//线
CA_EXTERN NSString * const kCAEmitterLayerRectangle
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//矩形
CA_EXTERN NSString * const kCAEmitterLayerCuboid
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//立方体
CA_EXTERN NSString * const kCAEmitterLayerCircle
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//圆形
CA_EXTERN NSString * const kCAEmitterLayerSphere
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//球体
- renderMode: 发射模式,如下所示:
/** `emitterMode' values. **/
CA_EXTERN NSString * const kCAEmitterLayerPoints
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//从发射器中
CA_EXTERN NSString * const kCAEmitterLayerOutline
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//边缘
CA_EXTERN NSString * const kCAEmitterLayerSurface
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//表面
CA_EXTERN NSString * const kCAEmitterLayerVolume
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//中点
- renderMode : 渲染模式,值如下所示:
/** `renderMode' values. **/
CA_EXTERN NSString * const kCAEmitterLayerUnordered
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//粒子是无序出现的
CA_EXTERN NSString * const kCAEmitterLayerOldestFirst
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//声明久的粒子会被渲染在最上层
CA_EXTERN NSString * const kCAEmitterLayerOldestLast
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//年轻的粒子会被渲染在最上层
CA_EXTERN NSString * const kCAEmitterLayerBackToFront
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//粒子的渲染按照Z轴的前后顺序进行
CA_EXTERN NSString * const kCAEmitterLayerAdditive
CA_AVAILABLE_STARTING (10.6, 5.0, 9.0, 2.0);//进行粒子混合(变成火的就是这个)
发射器可以实现的效果:雨,雪,火,爆炸,波纹 ,水波, 声波 ,海水等。想不到的效果还有很多,需要多想,多记录,很多效果或许都有人已经调好数值,不需要我们花时间再去调试,但我们需要想到发射器能实现这种效果。
参考:
iOS CAEmitterLayer 粒子发射器的使用详解
iOS进阶之CAEmitterLayer
网上的一份代码,包括了集中效果,虽然因为年代久远无法运行,但把代码拷贝出来使用应该还是可以的:http://www.okbase.net/file/item/21207。