Core Animation之多種動畫效果

2021-07-04 10:24:28 字數 2106 閱讀 3546

前面介紹了core animation基礎知識,還有calayer的簡單使用,最終還是有要動畫的滴,這裡列出幾個動畫效果,參考下能加深對core animation的認識和理解

使用caanimationgroup疊加動畫效果,就是下面按鈕《把移到右下角變小透明》描述的效果:

上面三個圖是動畫的三個狀態,實現**如下:

[cpp]view plain

copy

- (void

)viewdidload    

[cpp]view plain

copy

- (ibaction)tranaction:(id)sender   

**解析:上面關鍵幀設定了動畫的路徑,scaleanim設定了縮小,opacityanim設定了透明度的變化。把三個動畫組合到:animgroup。

在把animgroup新增到imageview.layer層的動畫裡。於是動畫效果就有了。

[cpp]view plain

copy

- (ibaction)rightrotateaction:(id)sender   

**解析:可能你沒注意到,

catransform3dmakerotation,這返回的是旋轉的值。上面的動畫效果裡返回的是

catransform3dmakescale縮放的值。

向右移動是因為關鍵幀使用了路徑為直線的路徑。

[cpp]view plain

copy

- (ibaction)rotate360action:(id)sender   

如果你仔細觀察,會看到第二個動畫裡在旋轉時,邊緣是有鋸齒的,如何消除呢?

在邊緣新增乙個畫素的透明區域,去鋸齒。

uigraphicsbeginimagecontext 開始內容

uigraphicsgetimagefromcurrentimagecontext 獲取當前內容作為,

uigraphicsendimagecontext結束。是和uigraphicsbeginimagecontext配套使用的。

這個有點複雜,首先說下實現的步驟:

畫乙個吃豆人開口的路徑:pacmanopenpath

畫乙個吃豆人閉口的路徑:pacmanclosedpath

新建乙個閉口的吃豆人頭的層:shapelayer

把開口和閉口路徑設定成cabasicanimation*chompanimation動畫的起點和終點,這樣迴圈就能出現咬牙的動畫了。

最後設定乙個路徑為關鍵幀,讓吃豆人在這條路徑上行動。

**如下:

[cpp]view plain

copy

- (void

)animationinit    

[cpp]view plain

copy

- (void

)startanimation   

[cpp]view plain

copy

- (void

)viewdidload    

還需要新增乙個巨集:

#define degrees_to_radians(x) (3.14159265358979323846 * x / 180.0)    計算角度轉換

新增了個手勢,點一下螢幕,吃豆人就動起來了。效果:

本篇例子**:**

容芳志 (

本文遵循「署名-非商業用途-保持一致」創作公用協議

Core Animation之多種動畫效果

前面介紹了core animation基礎知識,還有calayer的簡單使用,最終還是有要動畫的滴,這裡列出幾個動畫效果,參考下能加深對core animation的認識和理解。1 把移到右下角變小透明 使用caanimationgroup疊加動畫效果,就是下面按鈕 把移到右下角變小透明 描述的效果...

Core Animation之多種動畫效果

前面介紹了core animation基礎知識,還有calayer的簡單使用,最終還是有要動畫的滴,這裡列出幾個動畫效果,參考下能加深對core animation的認識和理解 使用caanimationgroup疊加動畫效果,就是下面按鈕 把移到右下角變小透明 描述的效果 上面三個圖是動畫的三個狀...

Core Animation之多種動畫效果

前面介紹了core animation基礎知識,還有calayer的簡單使用,最終還是有要動畫的滴,這裡列出幾個動畫效果,參考下能加深對core animation的認識和理解 使用caanimationgroup疊加動畫效果,就是下面按鈕 把移到右下角變小透明 描述的效果 上面三個圖是動畫的三個狀...