[译] 快速指南:用UIViewPropertyAnimator作动画

翻译自:QUICK GUIDE: ANIMATIONS WITH UIVIEWPROPERTYANIMATORbash

译者:Haley_Wong闭包

iOS 10 带来了一大票有意思的新特性,像 UIViewPropertyAnimator,它是一个改善动画处理的全新的类。 这个视图属性动画彻底颠覆了咱们已经习惯的流程,可以为动画逻辑添加更精细的控制。app

一个简单的动画

让咱们来看看如何经过一个简单的动画改变视图的中心点属性。iview

let animator = UIViewPropertyAnimator(duration: 1.0, curve: .easeOut){
    AView.center = finalPoint
}
animator.startAnimation()
复制代码

至少有3点须要注意:ide

  1. 这个动画是经过闭包来定义的,与UIView 的动画类很类似“UIView.animation(duration:…)”。
  2. 返回一个对象,即动画建立者。
  3. 这个动画不是马上开始的,而是经过 startAnimation()方法触发的。

动画状态

咱们对一个元素执行动画操做方式的主要变化与如下事实有关:一个属性动画器包含一整套状态机逻辑。经过UIViewAnimating协议实现的功能以一种简单明了的方式管理动画的状态,而这些状态又是经过startAnimation, pauseAnimationstopAnimation函数来实现的。调用这些方法咱们能够更新状态的值,使之能在active,inactivestopped之间转换。函数

当动画开始或者暂停时,动画的状态就是活跃状态;当动画已被初始化可是还未开始或者动画已完成,它就是非活跃状态。须要注意的是 在活跃状态中止态之间有一点点不一样。当动画因中止命令而完成或者它真的已经完成后,状态会变成中止态,动画器内部会调用方法finishAnimation(at:) 来标记动画 已完成,将状态设置为非活跃状态,并最终调用完成的代码块。动画

动画的可选项

可能你已经在前面的例子里注意到,挨着动画的 block,咱们定义了两个参数:动画的时长 和动画的曲线,一个UIViewAnimationCurve实例,表明着最多见的曲线(easeIn,easeOut,linear或easeInOut)。ui

若是你须要对动画取消有更多的控制,你能够用由两个控制点定义的贝塞尔曲线。spa

let animator = UIViewPropertyAnimator(
               duration: 1.0, 
               point1: CGPoint(0.1,0.5), 
               point2: CGPoint(0.5, 0.2){
 
        AView.alpha = 0.0
}
复制代码

(若是一条贝塞尔曲线依然不够,那么你甚至能够利用UITimigCurveProvider来指定一条彻底自定义的曲线)翻译

另外一个能够传给构造器的有意思的参数是 阻尼系数值。用法与UIView 的动画方法相似,你能够定义出弹簧效果,阻尼系数的取值范围是0到1.

let animator = UIViewPropertyAnimator(
               duration: 1.0,
               dampingRatio:0.4){
 
        AView.center = CGPoint(x:0, y:0)
}
复制代码

延迟动画的执行也很是的简单,只须要调用 带有afterDelay参数的startAnimation方法便可。

animator.startAnimation(afterDelay:2.5)
复制代码

动画的block

UIViewPropertyAnimator 采用的是可以为动画器提供不少有趣能力的UIViewImplicitlyAnimating协议。例如,除了在初始化的时候指定的block外,你还能够指定多个动画block。

// Initialization
let animator = UIViewPropertyAnimator(duration: 2.0, curve: .easeOut){
    AView.alpha = 0.0
}
// Another animation block
animator.addAnimation{ 
    Aview.center = aNewPosition
}
animator.startAnimation()
复制代码

你还能够向已在运行的动画添加动画块,该动画块将当即使用剩余时间做为新动画的持续时间来执行。

与动画流交互

正如咱们已提过的那样,咱们能够经过调用startAnimation, pauseAnimationstopAnimation轻松地与动画流交互。动画的默认流(从起始点到结束点),能经过fractionComplete属性更改。这个值表示动画完成的百分比,取值范围是0 到 1。你可以修改这个值来像你指望的那样驱动流(例如:用户可能会用滑块或滑动手势实时地修改fraction)。

animator.fractionComplete = slider.value
复制代码

某些情形下,你可能但愿在动画运行完毕时执行一些操做。 addCompletion 方法能让你添加一个(当动画完成时会被触发的)代码块。

animator.addCompletion { (position) in
    print("Animation completed")
}
复制代码

position参数是一个 UIViewAnimatingPosition类型的值,它有三个枚举值,分别表明动画是在开始中止,结束后中止,仍是当前位置中止。 一般你都会收到结束的枚举值。 (译者注:UIViewAnimatingPosition的三个枚举值分别是end,start,current)

这就是这份快速指南的所有内容啦。

我已经火烧眉毛地想要用这个新的动画系统来实现一些很酷的UI 效果了。

相关文章
相关标签/搜索