iOS動畫編程-AutoLayout動畫[ 5 ] Animating dynamically created views

前段時間考試，沒有來得及寫文，最近會抽時間把Animation部分寫完

介紹

這一節中，咱們將利用本節所學的內容，建立一個新的View，添加約束並顯示出來
showItem(_:)函數將在咱們點擊TableViewRow的時候顯示出來一個新的View，實現以下效果：

Add the following code to showItem(_:) to create an image view out of the selected image:
在方法中加入以下代碼來建立一個新的View

let imageView = UIImageView(image:
    UIImage(named: "summericons_100px_0\(index).png"))
    imageView.backgroundColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.5)
    imageView.layer.cornerRadius = 5.0 
    imageView.layer.masksToBounds = true
    imageView.translatesAutoresizingMaskIntoConstraints = false 
    view.addSubview(imageView)

在上面的代碼中，咱們加載了一張圖片，建立了一個新的ImageView，修改了圓角並設置了背景，注意，咱們沒有設置這個控件在父視圖的位置。
接下來咱們將經過代碼對這個ImageView設置一個個約束：

let conX = imageView.centerXAnchor.constraintEqualToAnchor( view.centerXAnchor)

這裏使用了NSLayoutAnchor這個類，這個類容許咱們使用很簡單的方法建立約束，這裏咱們建立了ImageView X中心與主View X中心位置之間的約束

let conBottom = imageView.bottomAnchor.constraintEqualToAnchor( 
    view.bottomAnchor, constant: imageView.frame.height)
    let conWidth = imageView.widthAnchor.constraintEqualToAnchor( view.widthAnchor,
    multiplier: 0.33,
    constant: -50.0)
    let conHeight = imageView.heightAnchor.constraintEqualToAnchor( imageView.widthAnchor)
    //使約束生效
    NSLayoutConstraint.activateConstraints([conX, conBottom, conWidth, conHeight])

這步完成以後，咱們的新視圖就已經出如今屏幕下方了接下來咱們用動畫把它移到屏幕中央

Adding additional dynamic animations

接下來咱們經過約束調整視圖在Y軸方向的位置

UIView.animateWithDuration(0.8, delay: 0.0, usingSpringWithDamping: 0.4, initialSpringVelocity: 0.0, options: [], animations: {
    conBottom.constant = -imageView.frame.size.height/2 conWidth.constant = 0.0
    //使約束生效
    self.view.layoutIfNeeded()
    }, completion: nil)

運行一下，咱們發現圖片從屏幕的左上角飛到屏幕中央，這是爲何呢
思考一下: 你添加了一個新的View，設置了一些約束，而後使這些約束動態的設置來改變佈局，然而這個View的默認位置在左上角（0,0）處 ,它沒有機會去應用這些約束，直到你在動畫必報中調用，爲了解決這個問題，咱們應該在動畫前將設置初始位置的約束生效:
在動畫閉包前先調用一次layoutIfNeeded()

移除視圖

咱們能夠在動畫的完成閉包裏延遲1s並移除imageView

//尾掛閉包
    { (_) -> Void in
                UIView.animateWithDuration(0.8, delay: 1, options: [], animations: { () -> Void in
                    conBottom.constant += self.view.frame.size.height/2
                    self.view.layoutIfNeeded()
                    }){(_)-> Void in
                        self.view.willRemoveSubview(imageView)
                }
        }

最終效果