以编程方式创建自定义视图，然后为其设置动画

Question

我正在以编程方式创建一个自定义视图，它工作正常，然后我尝试为该视图设置动画。出于某种奇怪的原因，视图完全是动画的，我不确定为什么。这是代码：

  override func viewDidLoad() {
    super.viewDidLoad()


    let customView = UIView(frame: CGRect(x: 10, y: 10, width: 100, height: 100))

    customView.backgroundColor = UIColor.blue
    customView.layer.cornerRadius = 25
    customView.layer.borderWidth = 8
    customView.layer.borderColor = UIColor.red.cgColor

    self.view.addSubview(customView)

    UIView.animate(withDuration: 4, animations: {

      customView.transform.translatedBy(x: 40, y: 60)
      customView.transform.rotated(by: CGFloat.pi/2)
      customView.transform.scaledBy(x: 0, y: 0.5)

    })
  }

Answer 1

你最好在 viewDidAppear 中调用这个动画块，有一些延迟。

import UIKit

class ViewController: UIViewController {

    var customView = UIView()

    override func viewDidLoad() {
        super.viewDidLoad()

        customView = UIView(frame: CGRect(x: 10, y: 10, width: 100, height: 100))
        customView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(handleTap)))

        customView.backgroundColor = UIColor.blue
        customView.layer.cornerRadius = 25
        customView.layer.borderWidth = 8
        customView.layer.borderColor = UIColor.red.cgColor

        self.view.addSubview(customView)
    }

    override func viewDidAppear(_ animated: Bool) {
        UIView.animate(withDuration: 5, delay: 1, usingSpringWithDamping: 1, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
          self.customView.transform = CGAffineTransform(scaleX: 1, y: 0.5)
          self.customView.transform = CGAffineTransform(rotationAngle: CGFloat.pi/2)
          self.customView.transform = CGAffineTransform(translationX: 40, y: 60)
        }, completion: nil)
    }

    func handleTap() {
        UIView.animate(withDuration: 5, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
            self.customView.transform = CGAffineTransform(scaleX: 1, y: 0.5)
            self.customView.transform = CGAffineTransform(rotationAngle: CGFloat.pi/2)
            self.customView.transform = CGAffineTransform(translationX: 40, y: 60)
        }, completion: nil)
    }

}

Answer 2

你的问题不正确。您的视图没有动画效果。

为什么？

您正在使用 return 函数，您的 customView 需要像这样捕捉修改后的版本。

customView.transform =  customView.transform.translatedBy(x: 40, y: 60)

所以你的代码应该是这样的。

let customView = UIView(frame: CGRect(x: 10, y: 10, width: 100, height: 100))

    customView.backgroundColor = UIColor.blue
    customView.layer.cornerRadius = 25
    customView.layer.borderWidth = 8
    customView.layer.borderColor = UIColor.red.cgColor

    self.view.addSubview(customView)

    UIView.animate(withDuration: 4, animations: {

       customView.transform =  customView.transform.translatedBy(x: 40, y: 60)
       //customView.transform = customView.transform.rotated(by: CGFloat.pi/2)
       //customView.transform = customView.transform.scaledBy(x: 0, y: 0.5)

    })

有很多在线资源如何分组 animation.Just google。:)

以编程方式创建自定义视图，然后为其设置动画

create a custom view programmatically then animate it

ios

swift

uiview

transform

uianimation