粒子效果的實(shí)現(xiàn)需要使用兩個(gè)類(lèi):CAEmitterLayer 和 CAEmitterCell
CAEmitterLayer
CAEmitterLayer是Core Animation中的特殊圖層舍败,繼承自CALayer咨跌,是一個(gè)粒子發(fā)射器熊昌,用于控制粒子效果
屬性
屬性 | 說(shuō)明 |
---|---|
emitterCells | 粒子數(shù)組喜滨,創(chuàng)建好的粒子樣式痴怨,需要放入數(shù)組中雏婶,支持多種粒子樣式 |
birthRate | 粒子的產(chǎn)生率过椎,默認(rèn)是1.0 |
lifetime | 粒子的生命周期忆肾,默認(rèn)是1.0 |
emitterPosition | 發(fā)射源的中心點(diǎn)位置荸频,默認(rèn)是(0, 0, 0) |
emitterCells | 粒子數(shù)組創(chuàng)建好的粒子樣式,需要放入數(shù)組中客冈,支持多種粒子樣式 |
emitterZPosition | 三維立體中的位置旭从,處于立體的效果時(shí)使用 |
emitterSize | 發(fā)射源的尺寸大小 |
emitterDepth | 發(fā)射源的深度 |
emitterShape | 發(fā)射源的形狀,默認(rèn)是point |
emitterMode | 發(fā)射模式场仲,默認(rèn)是volum |
renderMode | 渲染模式和悦,默認(rèn)是unordered |
preservesDepth | 是否需要深度,默認(rèn)是NO(如果設(shè)置為YES渠缕,表示粒子效果是三維空間的) |
velocity | 粒子初始速度鸽素,默認(rèn)是1.0 |
scale | 粒子縮放比例,默認(rèn)是1.0 |
spin | 粒子自旋轉(zhuǎn)速度亦鳞。默認(rèn)是1.0 |
seed | 隨機(jī)數(shù)發(fā)生器 |
下面著重介紹下常用的屬性
-
emitterShape
:決定發(fā)射源的形狀馍忽,并不是粒子的形狀 -
emitterMode
:發(fā)射模式,決定發(fā)射區(qū)域在發(fā)射源的哪一部分 -
emitterSize
:發(fā)射源的尺寸大小 -
emitterPosition
:發(fā)射源的重心點(diǎn)位置 -
renderMode
:渲染模式 -
emitterCells
:粒子樣式數(shù)組燕差,每一個(gè)粒子就是一個(gè)CAEmitterCell
其中 emitterShape 遭笋、 emitterMode、renderMode都是枚舉類(lèi)型
emitterShape:發(fā)射源的形狀
發(fā)射源的形狀有以下幾種
發(fā)射源形狀 | 說(shuō)明 |
---|---|
kCAEmitterLayerPoint | 點(diǎn) |
kCAEmitterLayerLine | 線(xiàn) |
kCAEmitterLayerRectangle | 矩形框 |
kCAEmitterLayerCuboid | 立體矩形框谁不,由于是3D的坐梯,iOS中默認(rèn)是2D,所以需要設(shè)置z方向的數(shù)據(jù) |
kCAEmitterLayerCircle | 圓形 |
kCAEmitterLayerSphere | 立體圓形刹帕,即球吵血,同樣需要設(shè)置z方向的數(shù)據(jù) |
emitterMode:發(fā)射模式
發(fā)射模式有以下幾種
發(fā)射模式 | 說(shuō)明 |
---|---|
kCAEmitterLayerPoints | 點(diǎn)模式 |
kCAEmitterLayerOutline | 輪廓模式谎替,從形狀邊緣上發(fā)射粒子 |
kCAEmitterLayerSurface | 表面模式,從形狀的表面上發(fā)射粒子 |
kCAEmitterLayerVolume | 立體模式蹋辅,3D形狀的物體內(nèi)部發(fā)射 |
renderMode:渲染模式
渲染模式有以下幾種
渲染模式 | 說(shuō)明 |
---|---|
kCAEmitterLayerUnordered | 粒子是無(wú)序出現(xiàn)的 |
kCAEmitterLayerOldestFirst | 最先創(chuàng)建的粒子在最前面 |
kCAEmitterLayerOldestLast | 最后創(chuàng)建的粒子在最前面 |
kCAEmitterLayerBackToFront | 粒子的渲染按照z軸的前后順序進(jìn)行 |
kCAEmitterLayerAdditive | 粒子混合 |
注:每秒粒子產(chǎn)生的個(gè)數(shù) = layer.birthRate * cell.birthRate
CAEmitterCell
CAEmitterCell是粒子的樣式類(lèi)钱贯,用來(lái)創(chuàng)建粒子,類(lèi)似于UITableView中的cell侦另,同時(shí)也可以復(fù)用
屬性
屬性 | 說(shuō)明 |
---|---|
name | cell標(biāo)識(shí)符秩命,默認(rèn)是nil |
enabled | cell是否顯示 |
birthRate | 每秒粒子的產(chǎn)生率,默認(rèn)是0 |
lifetime & lifetimeRange | cell的生命周期 & 生命周期的范圍褒傅,都默認(rèn)是0弃锐,以秒為單位 |
emissionLatitude | 指定緯度,維度角代表了x-z軸平面坐標(biāo)系中與x軸和z軸之間的夾角殿托,默認(rèn)是0 |
emissionLongitude | 指定經(jīng)度霹菊,經(jīng)度角代表了x-y軸平面坐標(biāo)系中與x軸和y軸之間的夾角,默認(rèn)是0 |
emissionRange | 發(fā)射角度范圍支竹,默認(rèn)是0 |
velocity & velocityRange | 粒子的初始速度 & 范圍旋廷,都默認(rèn)是0 |
xAcceleration & yAcceleration & zAcceleration | 在x、y礼搁、z軸上的重力加速度矢量饶碘,都默認(rèn)是0 |
scale | 粒子在生命周期范圍內(nèi)的縮放比例,默認(rèn)是1 |
scaleRange | 縮放比例范圍 馒吴,默認(rèn)是0扎运,負(fù)數(shù)縮小,正數(shù)放大 |
scaleSpeed | 縮放速度饮戳,默認(rèn)是0 |
spin & spinRange | 粒子的自旋轉(zhuǎn)速度 & 自旋轉(zhuǎn)角度范圍(弧度制)绪囱,都默認(rèn)是0 |
color | 粒子的顏色 |
redRange & greenRange & blueRange & alphaRange | 粒子的顏色RGBA能改變的范圍,默認(rèn)是0莹捡,范圍是[0,1] |
redSpeed & greenSpeed & blueSpeed & alphaSpeed | 粒子的顏色RGBA在生命周期內(nèi)改變的速度,都默認(rèn)是0扣甲,范圍是[0,1] |
contents | 粒子的內(nèi)容篮赢,設(shè)置為CGImageRef類(lèi)型的對(duì)象 |
contentsRect | 粒子內(nèi)容的位置 |
contentsScale | 粒子內(nèi)容的縮放比例 |
minificationFilter & magnificationFilter & minificationFilterBias | 縮小 & 放大的過(guò)濾器 |
emitterCells | 粒子中的粒子數(shù)組:即粒子也可以包含粒子 |
style | 樣式 |
下面著重介紹下常用的屬性
-
lifetime
:粒子生命周期,即存活時(shí)間琉挖,單位是秒 -
birthRate
:粒子的產(chǎn)生率启泣,即每秒產(chǎn)生多少粒子的個(gè)數(shù) -
contents
:粒子的內(nèi)容,通常為CGImageRef的對(duì)象示辈,將提供的圖片從UIImage轉(zhuǎn)換為CGImageRef類(lèi)型 -
name
:粒子的名字寥茫,即粒子的唯一標(biāo)識(shí),可以KVC通過(guò)name拿到粒子的需要修改的屬性 -
color
:粒子的顏色矾麻,會(huì)結(jié)合contents的顏色來(lái)決定粒子的最終顏色纱耻,如果想完全通過(guò)color來(lái)控制cell的顏色芭梯,最好設(shè)置一張白色的圖片 -
redSpeed & greenSpeed & blueSpeed & alphaSpeed
:color中RGBA的取值范圍,默認(rèn)還0弄喘,范圍是[0,1]玖喘,如果cell的color
設(shè)置為[[UIColor colorWithRed:0.5 green:0.4 blue:0.5 alpha:1] CGColor];
,在設(shè)置redSpeed & greenSpeed & blueSpeed & alphaSpeed全部為0.1蘑志,對(duì)應(yīng)的RGB取值范圍是R(0.1, 0.5)累奈、G(0.1,0.4 )、B(0.1, 0.5)急但、A(0.1, 1.0)
-
velocity & velocityRange
: 粒子的初始速度和范圍 -
xAcceleration & yAcceleration & zAcceleration
:分別是x澎媒、y、z軸上的加速度波桩,當(dāng)為正數(shù)時(shí)戒努,向坐標(biāo)軸的正方向加速,反之突委,向負(fù)方向加速 -
scale & scaleRange
:粒子的縮放比例及范圍柏卤,縮放比例默認(rèn)是0,范圍是[0,1]
以下是實(shí)現(xiàn)的幾種的粒子效果圖示
-
粽子雨匀油、紅包雨等粒子效果
-
點(diǎn)贊按鈕的粒子效果
-
類(lèi)似煙花的粒子效果
-
下雨的粒子效果
以上的幾種效果的實(shí)現(xiàn)就不一一詳細(xì)說(shuō)明了.
粒子效果實(shí)現(xiàn)的一般步驟
接下來(lái)總結(jié)粒子效果實(shí)現(xiàn)的步驟:
- 利用
CAEmitterLayer
創(chuàng)建粒子圖層layer,即發(fā)射源敌蚜,并添加到視圖的layer上 - 設(shè)置發(fā)射源的屬性桥滨,例如:emitterShape、emitterMode弛车、emitterSize齐媒、emitterPosition等
- 通過(guò)
CAEmitterCell
創(chuàng)建粒子cell - 設(shè)置粒子的相關(guān)屬性,例如contents纷跛、birthRate喻括、lifetime、speed等
- 將粒子cell添加到發(fā)射源的
emitterCells
數(shù)組中
部分示例代碼如下:
- (void)zongZiRain{
// 1贫奠、設(shè)置CAEmitterLayer
CAEmitterLayer *rainLayer = [CAEmitterLayer layer];
// 2唬血、在背景圖上添加粒子圖層
[self.view.layer addSublayer:rainLayer];
self.rainlayer = rainLayer;
// 3、發(fā)射形狀--線(xiàn)性
rainLayer.emitterShape = kCAEmitterLayerLine;
//發(fā)射模式
rainLayer.emitterMode = kCAEmitterLayerSurface;
//發(fā)射形狀的大小
rainLayer.emitterSize = self.view.frame.size;
//發(fā)射的中心點(diǎn)位置
rainLayer.emitterPosition = CGPointMake(self.view.bounds.size.width*0.5, -10);
// 4唤崭、配置cell
CAEmitterCell *cell = [CAEmitterCell emitterCell];
//粒子圖片
cell.contents = (id)[[UIImage imageNamed:@"zongzi2.jpg"] CGImage];
//每秒鐘創(chuàng)建的粒子對(duì)象拷恨,默認(rèn)是0
cell.birthRate = 1.0;
//粒子的生存周期,以s為單位谢肾,默認(rèn)是0
cell.lifetime = 30;
//粒子發(fā)射的速率腕侄,默認(rèn)是1
cell.speed = 2;
//粒子的初始平均速度及范圍,默認(rèn)為0
cell.velocity = 10.0f;
cell.velocityRange = 10.0f;
//y方向的加速度矢量,默認(rèn)是0
cell.yAcceleration = 60;
//粒子的縮放比例及范圍,默認(rèn)是[1,0]
cell.scale = 0.05;
cell.scaleRange = 0.0f;
// 5冕杠、添加到圖層上
rainLayer.emitterCells = @[cell];
}
完整的代碼見(jiàn)Github - 12-CAEmitterLayer_實(shí)現(xiàn)粒子效果_OC