中断UIView过渡

时间:2018-10-26 10:56:08

标签: ios swift uiview uiviewanimation uiviewanimationtransition

在iOS上,UIView.transition处于当前状态是否有可能中断?

为您提供一些背景信息:我有一个UIButton,需要在其上设置标题颜色的动画-但是,动画可以附加不同的延迟。由于UIView.transition不支持延迟,因此我只是延迟了整个块的执行:

DispatchQueue.main.asyncAfter(deadline: .now() + delay) {
    UIView.transition(with: button, duration: 0.4, options: [.beginFromCurrentState, .allowUserInteraction, .transitionCrossDissolve], animations: {
        button.setTitleColor(selected ? .red : .black, for: .normal)
    }, completion: nil)
}

这里的问题是,如果以不同的延迟快速连续执行此代码,则结果可能是意外的。因此,例如,可以使用selected=true, delay=0.5进行调用,然后立即使用selected=false, delay=0.0进行调用。在这种情况下,即使它应该是黑色,按钮也会变成红色。

因此,我正在寻找一种延迟UIView.transform,中断UIView.transform或通过setTitleColor()使UIView.animate动画化的方法。

1 个答案:

答案 0 :(得分:2)

我实际上创建了一个框架来专门执行此操作,您可以触发与时间进度或值插值进度相关的动画。框架和文档可以在这里找到:

https://github.com/AntonTheDev/FlightAnimator

以下示例假定您具有CATextLayer支持的视图,因为这不是有关如何进行设置的问题,下面是一个入门的小示例:

class CircleProgressView: UIView {
    .....

    override class func layerClass() -> AnyClass {
        return CircleProgressLayer.self
    }
}

示例1:

假设您有一个支持CATextLayer的视图,我们可以按如下所示对其前景色进行动画处理,并触发另一个与时间有关的动画:

var midPointColor = UIColor.orange.cgColor
var finalColor    = UIColor.orange.cgColor
var keyPath       = "foregroundColor"

textView.animate { [unowned self] (a) in
    a.value(midPointColor, forKeyPath : keyPath).duration(1.0).easing(.OutCubic)

    // This will trigger the interruption 
    // at 0.5 seconds into the animation

    animator.triggerOnProgress(0.5, onView: self.textView, animator: { (a) in
        a.value(finalColor, forKeyPath : keyPath).duration(1.0).easing(.OutCubic)
    })
}

示例2:

就像在前面的示例中一样,一旦有了CATextLayer支持的视图,我们就可以相对于RBG值的进度矩阵对其前景色进行动画处理,该RBG值是根据3个值的大小进度计算的:

var midPointColor = UIColor.orange.cgColor
var finalColor    = UIColor.orange.cgColor
var keyPath       = "foregroundColor"

textView.animate { [unowned self] (a) in
    a.value(midPointColor, forKeyPath : keyPath).duration(1.0).easing(.OutCubic)

    // This will trigger the interruption 
    // when the magnitude of the starting point
    // is equal to 0.5 relative to the final point

    a.triggerOnValueProgress(0.5, onView: self.textView, animator: { (a) in
        a.value(finalColor, forKeyPath : keyPath).duration(1.0).easing(.OutCubic)
    })
}

希望这会有所帮助:)