美文网首页
Advances in UIKit Animations and

Advances in UIKit Animations and

作者: coderzcj | 来源:发表于2016-09-01 15:08 被阅读82次

新的API优点: Fluid, Responsive, Natural, Smooth

  • Timing Functions
    UIView.animate(withDuration:2.0, delay: 0.0,
    options:[.linear]) {
    circle.center.x = 800.0
    }


    linear.png
    curve.png
  • UIViewPropertyAnimator


    relationship.png
    let timing   = UICubicTimingParameters(animationCurve: .easeInOut)
    let animator = UIViewPropertyAnimator(duration: 2.0, timingParameters:timing)
    animator.addAnimations {
     // frame, center, alpha, and transform
    self.squareView.center = CGPoint(x: 800.0, y: self.squareView.center,y)
    self.squareView.transform = CGAffineTransform(rotationAngle: CGFloat(M_PI_2))
    }
      animator.addCompletion {_ in
      self.squareView.backgroundColor = UIColor.orange()
    }
    animator.startAnimation()
    
  • 标准初始化后

startAnimation()

  • 立即开始动画(类方法)

runningPropertyAnimator(withDuration:delay:options:animations:completion:)

  • State


    State transitions for an animator object.png

var state: UIViewAnimatingState { get }
var isRunning: Bool { get }
var isReversed: Bool { get set }

  • 动态修改动画

  • Start, pause, resume, and stop animations

  • Add animation blocks
    addAnimations(:) and addAnimations(:delayFactor:)

  • Scrub through a paused animation by modifying the fractionComplete property.

  • Change the animation’s direction using the isReversed property.

  • Modify the timing and duration of a partially complete animation by pausing the animation and using the continueAnimation(withTimingParameters:durationFactor:) method to finish it.

UIViewAnimating

  • Every newly created animator starts off in the inactive state. Similarly, an animator that has finished its animations returns to the inactive state.

  • pauseAnimation() method :paused so that you can modify those animations.

  • stopAnimation(_:) method: the animator object moves to the stopped or inactive state and must be reconfigured before it can be used again.

Timing providers

A cubic Bézier timing curve.png
// 1
UICubicTimingParameters()

UICubicTimingParameters(animationCurve: .linear)

UICubicTimingParameters(controlPoint1: CGPoint(x:0.0, y:1.0),
                        controlPoint2: CGPoint(x:1.0,y:0.0))

// 2
UISpringTimingParameters()

UISpringTimingParameters(dampingRatio: 0.8,
                      initialVelocity: CGVector(dx:1.0, dy: 0.0))

UISpringTimingParameters(mass: CGFloat, stiffness: CGFloat,
                      damping: CGFloat, initialVelocity velocity: CGVector)

相关文章

网友评论

      本文标题:Advances in UIKit Animations and

      本文链接:https://www.haomeiwen.com/subject/vftsjttx.html