項目地址:https://github.com/kciter/GlitchLabel
效果很酷炫,就是盯久了有點眼暈。
使用:
GlitchLabel
繼承自 UILabel
,源碼就一個文件。直接作為 UILabel 使用就有了默認效果。
實現機制?
init 的時候創(chuàng)建了一個 Timer,以 30Hz 的頻率觸發(fā) GlitchLabel.tick
在里面配置 Glitch 階段,并 setNeedsDisplay
:
@objc fileprivate func tick() {
phase += phaseStep
if phase > 1 {
phase = 0
channel = (channel == 2) ? 0 : channel + 1
amplitude = amplitudeBase + (amplitudeRange * random())
}
setNeedsDisplay()
}
這里面用到的都是 Double 類型的“magic number”,又沒有注釋,乍一看確實不太知道這幾個變量是干嘛的。大致看了一下,channel
是用來生成紅綠藍三通道Glitch效果的,amplitude
是實時振幅,通過正弦函數使得 label 的偏移效果以原本位置為起點進行往復,phase
是以 phaseStep
步進的,與隨機生成的振幅一起用在 ChannelsImage
的生成上。
另外還有一個變量在 drawText
里:globalAlpha
, 也是一個隨機數,實現 ChannelsImage 的 Alpha 通道的隨機化。
視覺效果的配置在 drawText(in rect: CGRect)
里, 效果配置的核心函數是fileprivate func getChannelsImage(_ x1: CGFloat, x2: CGFloat, x3: CGFloat) -> UIImage
和 fileprivate func getScanlineImage(_ channelsImage: UIImage) -> UIImage
, 一個實現偏振效果,一個實現掃描線效果(大概是這么譯?)
總的來說,整個 GlitchLabel 依賴于隨機之美,效果很棒。