项目地址:https://github.com/kciter/GlitchLabel
效果很酷炫,就是盯久了有点眼晕。
使用:
GlitchLabel
继承自 UILabel
,源码就一个文件。直接作为 UILabel 使用就有了默认效果。
实现机制?
init 的时候创建了一个 Timer,以 30Hz 的频率触发 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 依赖于随机之美,效果很棒。