UIView block based animation weird behavior

Question

I have got this very simple animation (case):

class ViewController: UIViewController {

var v: UIView!
var b = false

override func viewDidLoad() {
    super.viewDidLoad()

    self.v = UIView(frame: CGRect(x: 120, y: 250, width: 30, height: 30))
    self.v.backgroundColor = .red
    self.view.addSubview(self.v)
}

@IBAction func didTapButton(_ sender: UIButton) {
    UIView.animate(withDuration: 3,
                   delay: 0,
                   options: [.beginFromCurrentState, .curveLinear],
                   animations: {
                    if self.b {
                        self.v.frame = CGRect(x: 120, y: 250, width: 30, height: 30)
                    } else {
                        self.v.frame = CGRect(x: 240, y: 250, width: 30, height: 30)
                    }
                    self.b = !self.b
    },
                   completion: nil)
}
}

On each tap of the button the red view moves to left or right depending on current direction. The animation should start from the current position and to be linear.

However if I tap the button when the previous animation is already in progress then the red view does not start immediately to move in the opposite direction. It just freezes in the current position while the previous animation finishes and then starts moving. If I change the animation curve option from linear to easeOut and it works properly.

I am using iOS 10, Xcode 8.2.1

Any ideas why this happens?

Sharath Sharath · Accepted Answer · 2017-01-11T14:08:29

When the animation is on, the UI components will not react to new changes. It will buffer the input and react once the animation is complete. This is not related to the iOS or Xcode versions, but a normal behaviour.

UIView block based animation weird behavior

2 Answers