渐变动画 - 慢下来并加快速度

Question

我正在为CAGradientLayer制作动画，类似于Apple在iPhone主屏幕上使用“Slide to Unlock”动画的方式。然而，我的动画有点不同，它在某些点上减速并加速。

关于如何减慢/加速渐变的任何想法？

Answer 1

通常，在动画软件中，此效果不是通过设置渐变的颜色位置动画来创建的，而是通过移动文本下方的整个渐变来创建，将文本视为蒙版。一般来说，这是更有效的，因为重绘渐变是很昂贵的。

这意味着将渐变绘制到材质（上下文）中，然后将其渲染到图像，并在文本下方移动图像，同时文本遮盖该图像。在游戏的传统中，使用两个图像，因此它们完美无缝地滚动，为您提供正确的效果。

然后，您只需加快或减慢渐变图像的位置动画。

我希望这有一些帮助...尽管你现在已经做了一些事情。

这里有一篇关于使用CATextLayers作为面具的博文：https://littlebitesofcocoa.com/245-masking-views-with-text-using-catextlayer

这里是位置的动画曲线，以获得您想要的结果：

创建此结果：

UPDATE：

这就像机械一样，有一个＆＃34;孔＆＃34;从表面材料中切出的文本，以及从下面传递的渐变纹理，上面的屏幕截图显示了动画曲线：

Answer 2

可能在每个动画之间暂停（或延迟）？在didMoveToWindow（）中的代码之间尝试对此进行修改：

func delay(_ delay:Double, closure:@escaping ()->()) {
    DispatchQueue.main.asyncAfter(
        deadline: DispatchTime.now() + Double(Int64(delay * Double(NSEC_PER_SEC))) / Double(NSEC_PER_SEC), execute: closure)
}