粒子系统
粒子系统
今天我来给大家分享一下粒子系统。首先我们假设在即时通讯中有如下一个需求:
- 我们输入下雨,
下雪
,么么哒
,烟花
等关键字的时候,需要在界面上展示相应的动画效果。 - 在展示动画效果的同时并不影响用户继续操作。
再此需求中如果我们gif
动画,就会出现如下弊端:
- 每次输入相同关键字时,动画效果都是一样的。
- 需求时整个屏幕都显示动画的时候,会阻断用户的继续操作。
面对这样的需求我们就能顺利成章的引入粒子系统。
粒子系统的组成
- CAEmitterLayers 一个或多个(通常只有一个)。
- CAEmitterCells 一个或多个
各部分功能
CAEmitterLayer
粒子控制器主要控制粒子的形状(比如:一个点,矩形,圆形等),发射的位置(比如:边缘,矩形内等),发射方式,背景颜色,粒子的大小等。基础是简单的,但这些参数却是相当微妙的。CAEmitterLayer有超过30种不同的参数进行自定义粒子的行为。下面,我就拼出来的一些特殊问题
CAEmitterCells
单个粒子模型(比如:一个雨点,一片雪花)。当散发出一个粒子,UIKit根据这个发射粒子和定义的基础上创建一个随机粒子。此原型包括一些属性来控制粒子的图片,颜色,方向,运动,缩放比例和生命周期。
代码设置及结构说明
代码设置
首先我们初始化CAEmitterLayer来控制粒子的发射位置,发射形式,发射背景等
CAEmitterLayer *emitter = [CAEmitterLayer layer];
emitter.frame = CGRectMake(0.0, 0.0, self.view.bounds.size.width, self.view.bounds.size.height);
emitter.backgroundColor = [UIColor blackColor].CGColor;
[self.view.layer addSublayer:emitter];
emitter.emitterShape = kCAEmitterLayerLine;
emitter.emitterPosition = CGPointMake(emitter.frame.size.width/2.0, 0.0);
emitter.emitterSize = emitter.frame.size;
接着我们初始化单个粒子模型。并且设置粒子模型的一些参数
CAEmitterCell *emitterCellA = [CAEmitterCell emitterCell];
emitterCellA.contents = CFBridgingRelease([UIImage imageNamed:@"love"].CGImage);
emitterCellA.birthRate = 50;
emitterCellA.yAcceleration = 70.0;
emitterCellA.xAcceleration = 10.0;
emitterCellA.emissionLongitude = -M_PI;
emitterCellA.velocityRange = 200.0;
emitterCellA.emissionRange = M_PI_2;
emitterCellA.lifetimeRange = 18;
emitterCellA.redRange = 0.3;
emitterCellA.greenRange = 0.3;
emitterCellA.blueRange = 0.3;
emitterCellA.scaleRange = 0.8;
emitterCellA.alphaRange = 0.75;
emitterCellA.alphaSpeed = -0.15;
CAEmitterCell *emitterCellB = [CAEmitterCell emitterCell];
emitterCellB.contents = CFBridgingRelease([UIImage imageNamed:@"flake3"].CGImage);
emitterCellB.birthRate = 250;
emitterCellB.yAcceleration = 70.0;
emitterCellB.xAcceleration = 10.0;
emitterCellB.emissionLongitude = -M_PI;
emitterCellB.velocityRange = 200.0;
emitterCellB.emissionRange = M_PI_2;
emitterCellB.lifetimeRange = 18;
emitterCellB.redRange = 0.3;
emitterCellB.greenRange = 0.3;
emitterCellB.blueRange = 0.3;
emitterCellB.scaleRange = 0.8;
emitterCellB.alphaRange = 0.75;
emitterCellB.alphaSpeed = -0.15;
最后我们将单个粒子模型放入粒子控制器中
emitter.emitterCells = @[emitterCellA, emitterCellB];
结构说明
- CAEmitterLayer提供了一个基于Core Animation的粒子发射系统,粒子用CAEmitterCell来初始化。粒子画在背景层盒边界上
- 属性:
-
birthRate:粒子产生系数,默认1.0;
-
emitterCells: 装着CAEmitterCell对象的数组,被用于把粒子投放到layer上;
-
emitterMode:发射模式
-
NSString * const kCAEmitterLayerPoints;
NSString * const kCAEmitterLayerOutline;
NSString * const kCAEmitterLayerSurface;
NSString * const kCAEmitterLayerVolume;
5. emitterShape:发射源的形状:
```
NSString * const kCAEmitterLayerPoint;
NSString * const kCAEmitterLayerLine;
NSString * const kCAEmitterLayerRectangle;
NSString * const kCAEmitterLayerCuboid;
NSString * const kCAEmitterLayerCircle;
NSString * const kCAEmitterLayerSphere;
7. emitterSize:发射源的尺寸大
**还有一些基本属性就不在这里一一介绍,大家可以自己参考API文档**
-
CAEmitterCell
-
属性:
- birthRate每秒某个点产生的CAEmitterCell数量
- lifetime & lifetimeRange 表示effectCell的生命周期,既在屏幕上的显示时间要多长。
- contents 这个和CALayer一样,只是用来设置图片
- name 这个是当effectCell存在caeEmitter 的emitterCells中用来辨认的。用到setValue forKeyPath比较有用
- velocity & velocityRange & emissionRange 表示cell向屏幕右边飞行的速度 & 在右边什么范围内飞行& +-角度扩散
*还有一些基本属性就不在这里一一介绍,大家可以自己参考API文档
说了这么多我们来看一下效果图吧
效果图[相关代码] https://github.com/LHCoder2016/CAEmitterLayerTest.git
[欢迎讨论] huliuworld@yahoo.com