開始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做了動畫效果。代碼如下:

而他的運行效果如下:

當然還有很多可以調節出來的效果,大家可以組合不同的參數試試。這里我只是簡單的組合了下,有個大概的印象。祝愉快!
