I'm adding a `UIView` to a view controller and want to it render and then immediately animate its movement, but a strange things is happening. The new view is being drawn at the destination where I want to animate it to and then animating to the origin that I had set it at. So it's essentially happening in reverse. Here's my code:

```swift
class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func buttonTapped(_ sender: Any) {
        let square = UIView()
        square.backgroundColor = .red
        square.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(square)
        [square.widthAnchor.constraint(equalToConstant: 100),
         square.heightAnchor.constraint(equalToConstant: 100),
         square.centerXAnchor.constraint(equalTo: view.centerXAnchor),
         square.centerYAnchor.constraint(equalTo: view.centerYAnchor)].forEach { $0.isActive = true }
        UIView.animate(withDuration: 2.0) {
            var frameCopy = square.frame
            frameCopy.origin.y -= 300
            square.frame = frameCopy
        }
    }

}

```

If I comment out the `UIView.animate` this is what gets created when I press the button, and this is what I expect

[![enter image description here](https://i.stack.imgur.com/jBjir.png)](https://i.stack.imgur.com/jBjir.png)

But then if I add the animation back in, this is what happens:

[![enter image description here](https://i.stack.imgur.com/arbDK.gif)](https://i.stack.imgur.com/arbDK.gif)

So as you can see the origin starts `-300` off centre and then moves to the centre whereas I want to to start on centre and then move `-300` off the screen. Can anyone help with this?

For the work I'm doing I need to add the view and then animate it immediately, I can't add the view previously and animate it later.