动画的UIView与约束它编程

Question

加入后，我有我编程方式添加到我的UIViewController像这样的的UIView：

if let myView = Bundle.main.loadNibNamed("MyView", owner: self, options: nil)?.first as? MyView 
    { 
     self.view.addSubview(myView) 
     myView.translatesAutoresizingMaskIntoConstraints = false 
     //Horizontal orientation 
     self.view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-10-[view]-10-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":myView])) 
    } 

多数民众赞成罚款，视图中添加与所需的空间左右，在（ 0,0）的视图控制器。

我想要实现的是，视图从视图控制器的底部向中心进行动画处理，然后从中心到顶部进行动画处理。 所以首先我试图动画它从它的中心的当前位置（0,0）

因此，我所做的是：

UIView.animate(withDuration: 1.0, 
        animations: 
    { 
     let center = NSLayoutConstraint(item: myView, attribute: .centerY, relatedBy: .equal, toItem: self.view, attribute: .centerY, multiplier: 1, constant: CGFloat(0.0)) 
     self.view.addConstraint(center) 
    }) 

那么认为是中心，但它不是动画。它直接跳转到它。

我搜索了很多答案，说我必须设置约束的常量，然后调用layoutIfNeeded()，但所有这些示例都使用对作为IBOutlet设置的约束的引用，这是我没有的约束以编程方式添加我的视图。

如何正确地为视图设置动画效果，从底部到中心再从中心到顶部？

谢谢！

问候

编辑1

好了我要去一点，并解释我想达到的目标。 在我的视图控制器上，显示给用户的5秒钟定时器之后，我想一个接一个地显示几个问题。

我想问一个问题，从下到上滑动，已回答，然后从中心向上滑出。然后下一个问题从下到上，被回答滑出等等。

因此，一个5秒计时器我打电话叫slideInQuestion方法创建一个问题，并激活它后：

func slideInQuestion() 
{ 
    let question:QuestionView = createQuestion() 
    UIView.animate(withDuration: 1.0, 
        animations: 
    { 
     self.yConstraint?.constant = CGFloat(0.0) 
     self.view.layoutIfNeeded() 
    }) 

的createQuestion方法实例化这个问题的观点和限制分配给它

func createQuestion() -> QuestionView 
{ 
    if let questionView = Bundle.main.loadNibNamed("QuestionView", owner: self, options: nil)?.first as? QuestionView 
    { 
     self.view.addSubview(questionView) 
     questionView.translatesAutoresizingMaskIntoConstraints = false 
     //Horizontal orientation 
     self.view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-10-[view]-10-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":questionView])) 
     yConstraint = NSLayoutConstraint(item: questionView, 
               attribute: .centerY, 
               relatedBy: .equal, 
               toItem: self.view, 
               attribute: .centerY, 
               multiplier: 1, 
               constant: CGFloat(UIScreen.main.bounds.height)) 
     self.view.addConstraint(yConstraint!) 
     return questionView 
    } 
    return QuestionView() 
} 

之前，我将yConstraint定义为一个实例变量，如Duncan C所建议的：

var yConstraint:NSLayoutConstraint? 

所以我期待什么，我现在是：

问题视图被创建，它的中心是在视图控制器的中心+屏幕的高度。这使得它在屏幕底部的可见视图之外。然后它在1秒内从该位置滑动到屏幕的中心Y（0.0）。

但是，什么是正确的，现在，从屏幕顶部滑动到屏幕的centerY以及在它会调整到的边缘，同时做左，右像它在第一约束集

self.view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-10-[view]-10-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":questionView])) 

我完全困惑，现在我希望我的解释有帮助，有人有一个想法。

谢谢！

Answer 1

由于我不知道你的观点是从你的包创建的，我已经根据您的代码入侵了一个快速示例。

关键是self.view.layoutIfNeeded()被调用两次。一旦添加了视图，并在动画块中第二次添加。而约束的修改不在动画块内。

import UIKit 

class ViewController: UIViewController { 

    var yConstraint:NSLayoutConstraint? 

    override func viewWillAppear(_ animated: Bool) { 

     self.createView() 

     self.view.layoutIfNeeded() 

     self.yConstraint?.constant = 32 
     UIView.animate(withDuration: 1.0) { 
      self.view.layoutIfNeeded() 
     } 

    } 

    func createView(){ 

     let questionView = UIView() 
     questionView.backgroundColor = UIColor.red 

     let heightConstraint = NSLayoutConstraint(item: questionView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1, constant: self.view.bounds.height-64) 
     questionView.addConstraint(heightConstraint) 

     self.view.addSubview(questionView) 

     questionView.translatesAutoresizingMaskIntoConstraints = false 

     //Horizontal orientation 
     self.view.addConstraints(
      NSLayoutConstraint.constraints(withVisualFormat: "H:|-10-[view]-10-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":questionView])) 

     yConstraint = NSLayoutConstraint(item: questionView, 
             attribute: .top, 
             relatedBy: .equal, 
             toItem: self.view, 
             attribute: .top, 
             multiplier: 1, 
             constant: CGFloat(UIScreen.main.bounds.height)) 
     self.view.addConstraint(yConstraint!) 
    } 
} 

Answer 2

创建约束并将其保存在实例变量中。然后当你想动画时，改变约束上的常量并从动画块中调用layoutIfNeeded，就像动画基于故事板的约束一样。

在你的情况下，不要在你的函数中使用let constraint = ...。相反，使用：

var centerConstraint: NSLayoutConstraint? 

在viewWillAppear中：

centerConstraint = NSLayoutConstraint(item: myView, 
    attribute: .centerY, 
    relatedBy: .equal, 
    toItem: self.view, 
    attribute: .centerY, 
    multiplier: 1, 
    constant: CGFloat(0.0)) 
self.view.addConstraint(center) 

而且当你要动画：

UIView.animate(withDuration: 1.0, 
        animations: 
    { 
     centerConstraint.constant = newValue //(Your value here.) 
     myView.layoutIfNeeded() 
    })