iOS动画编程-View动画[ 2 ] Spring动画

介绍

iOS中SpringAnimation是一种常见的动画,其效果就像弹簧一样,会在end point周围摆动几下后再回到end point,这里我们来介绍一下SpringAnimation的使用方法
《iOS动画编程-View动画[ 2 ] Spring动画》

我们会用到的Method

UIView.animateWithDuration(_:, delay:, 
 usingSpringWithDamping:, 
 initialSpringVelocity:, options:, 
 animations:, completion:)

这次的函数相比上次增加了两个参数:

  • usingSpringWithDamping: 参数的范围为0.0f到1.0f,数值越小「弹簧」的振动效果越明显。可以视为弹簧的劲度系数

  • initialSpringVelocity: 表示动画的初始速度,数值越大一开始移动越快。

Demo

继续上次的Demo,我们在viewWillAppear中先修改控件位置

  override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated)
    heading.center.x -= view.bounds.width
    username.center.x -= view.bounds.width
    password.center.x -= view.bounds.width
    loginButton.center.y += 30.0
    loginButton.alpha = 0
    }

加特技!

隐藏登录按钮

UIView.animateWithDuration(1.0, delay: 0.8, usingSpringWithDamping: 0.5, initialSpringVelocity: 0, options: UIViewAnimationOptions.CurveEaseOut, animations: { () -> Void in
        //先隐藏登录按钮
        self.loginButton.center.y -= 30.0
        self.loginButton.alpha = 1.0
        }, completion: nil)

 在viewDidAppear方法中,使用Spring动画使按钮弹出,同时透明度变成1

UIView.animateWithDuration(1.0, delay: 0.8, usingSpringWithDamping: 0.5, initialSpringVelocity: 0, options: UIViewAnimationOptions.CurveEaseOut, animations: { () -> Void in
self.loginButton.center.y -= 30.0
self.loginButton.alpha = 1.0
}, completion: nil)

点击按钮时按钮的动画效果

@IBAction func login() {
view.endEditing(true)
    
let bounds = self.loginButton.bounds
//使按钮的位置向下移动20,宽度增加80
UIView.animateWithDuration(1.5, delay: 0.0, usingSpringWithDamping: 0.2, initialSpringVelocity: 20, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in
        self.loginButton.bounds = CGRect(x: bounds.origin.x-20, y: bounds.origin.y, width: bounds.size.width+80, height: bounds.size.height)
        }) { _ in
            //完成的动作
}
    //spinner出现,调整位置,调整Button颜色
    UIView.animateWithDuration(0.33, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in
        self.loginButton.center.y += 60
        self.spinner.alpha = 1.0
        self.spinner.center = CGPoint(x: 40, y: self.loginButton.frame.size.height/2)
        self.loginButton.backgroundColor = UIColor(red: 0.85, green: 0.83, blue: 0.45, alpha: 1.0)
        
        }, completion: nil)
    
  }
    原文作者:Hydrogen
    原文地址: https://segmentfault.com/a/1190000003891753
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞