ios - 具有重复和延迟的 animateKeyframes 无法按预期工作

Question

我正在使用关键帧为标签创建一个简单的从左到右的动画，但是当动画重复时，延迟将被忽略。

第一次执行时，延迟3秒有效果，但当动画重复时，延迟被忽略。这会导致动画在结束后立即重新开始。

UIView.animateKeyframes(withDuration: 10, delay: 3, options: [.calculationModePaced, .repeat], animations: {
    let xDist = self.Label_ArtistAlbum2.frame.origin.x

    UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.1, animations: {
        self.Label_ArtistAlbum2.frame.origin.x = self.Label_ArtistAlbum2.frame.origin.x - (xDist * 0.1)
    })

    UIView.addKeyframe(withRelativeStartTime: 0.9, relativeDuration: 0.1, animations: {
        self.Label_ArtistAlbum2.frame.origin.x = 0
    })
}, completion: nil)

我尝试在最后添加一个额外的关键帧，但是即使更改了时间也没有效果:

UIView.animateKeyframes(withDuration: 10, delay: 3, options: [.calculationModePaced, .repeat], animations: {
    let xDist = self.Label_ArtistAlbum2.frame.origin.x

    UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.1, animations: {
        self.Label_ArtistAlbum2.frame.origin.x = self.Label_ArtistAlbum2.frame.origin.x - (xDist * 0.1)
    })

    UIView.addKeyframe(withRelativeStartTime: 0.1, relativeDuration: 0.7, animations: {
        self.Label_ArtistAlbum2.frame.origin.x = 0
    })

    //attempted pause - does not appear to work perhaps since the position is unchanged?
    UIView.addKeyframe(withRelativeStartTime: 0.8, relativeDuration: 0.2, animations: {
        self.Label_ArtistAlbum2.frame.origin.x = 0
    })
}, completion: nil)

如果延迟不会与动画的其余部分一起重复，我如何在整个动画重复之前创建一个暂停？

Answer 1

我在为加载 View 设置动画时遇到了类似的问题。我是这样解决的:

我为动画中的步骤创建了一个枚举

private enum TriangleToAnimate {
    case one
    case two
    case three
    case pause
}

我有我的变量

private var triangleViewToFireCount = TriangleToAnimate.one
var triangle1View : TriangleView
var triangle2View : TriangleView
var triangle3View : TriangleView

我启动一个计时器来运行每个动画

override init(frame: CGRect) {
    Timer.scheduledTimer(timeInterval: 0.33, target: self, selector: #selector(LoadingView.timerFire), userInfo: nil, repeats: true)
}

对于选择器，我有一个 fire 方法。在方法中，我为每个枚举案例设置了一个开关

func timerFire(){
    let anim = createAnimation()
    switch triangleViewToFireCount {
    case .one:
        triangle1View.layer.add(anim, forKey: "transform")
        triangleViewToFireCount = .two
    case .two:
        triangle2View.layer.add(anim, forKey: "transform")
        triangleViewToFireCount = .three
    case .three:
        triangle3View.layer.add(anim, forKey: "transform")
        triangleViewToFireCount = .pause
    default:
        triangleViewToFireCount = .one
    }
}

这是我如何将动画创建为关键帧的代码

func createAnimation() -> CAKeyframeAnimation{
    let tr = CATransform3DIdentity
    let orignalScale = CATransform3DScale(tr, 1, 1, 1)
    let doubleScale = CATransform3DScale(tr, 2, 2, 1)
    let keyAn = CAKeyframeAnimation(keyPath: "transform")
    keyAn.keyTimes = [0, 0.1, 0.6]
    keyAn.duration = 1
    keyAn.values = [orignalScale,doubleScale,orignalScale]
    keyAn.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut)
    return keyAn
}