[Swift]Metronome #3 Glowing Animation發光動畫效果

Penny N.
Jul 7, 2020

--

Photo by Alexander Popov on Unsplash

現在節拍器加上了發光的動畫效果,顯示速度的圓圈外圍會依照目前的節拍及音樂速度發光。第一拍是白色的,而其餘拍子是藍色。

因為sublayer無法被加在image view底下,所以我加了一個view在顯示音樂速度BPM的image view底下,並將黑白雙色的陰影做在那個view上面,而glowing的動畫也是做在這個view上。

依照製作雙層陰影的方式,為這個view客製化一個繼承UIView的型別,並將開始及停止動畫的function寫在裡面,之後在MainVC就可以透過這個view的outlet來呼叫function。

這個動畫主要是建立一個CABasicAnimation的物件,將它加在glowing陰影的layer上,透過控制shadow radius的數值變化來達到glowing的效果,並設定讓它auto reverse、無限次repeat。

Glowing動畫的開始與終止分別設定在節拍開始及終止的function中。

而讓陰影顏色依據第幾拍來顯示,則是設定在拍子的timer之中。

這樣就成功做出了glowing shadow!

--

--

Penny N.
Penny N.

Written by Penny N.

A passionate self-taught  iOS developer. Write to record my learning and share the knowledge

No responses yet