效果圖
QQ20180806-161608@2x.png
點(diǎn)擊加號键菱，顯示選擇的項目，右上角加號今布，變?yōu)閤號经备。
點(diǎn)擊x號拭抬，收起選擇項目，x號變加號侵蒙。
核心動畫代碼
1.頂部title動畫
//在點(diǎn)擊加號的方法里
isMenuOpen = !isMenuOpen
//查看標(biāo)題相關(guān)的約束
titleLabel.superview?.constraints.forEach { constraint in
//找到有關(guān)標(biāo)題的約束造虎，并且是關(guān)于centerx的約束，重新設(shè)置centerx約束
if constraint.firstItem === titleLabel &&
constraint.firstAttribute == .centerX {
constraint.constant = isMenuOpen ? -100.0 : 0.0
return
}
//替換相關(guān)約束纷闺，在storyboard給約束一個id算凿，
//把約束狀態(tài)改為false，就會失去與控件的關(guān)聯(lián)犁功。
//然后添加一個新的約束氓轰，在最后把約束的id重新給新的約束賦上，并使約束狀態(tài)改為true浸卦。
if constraint.identifier == "TitleCenterY" {
constraint.isActive = false
let newConstraint = NSLayoutConstraint(
item: titleLabel,
attribute: .centerY,
relatedBy: .equal,
toItem: titleLabel.superview!,
attribute: .centerY,
multiplier: isMenuOpen ? 0.67 : 1.0,
constant: 5.0)
newConstraint.identifier = "TitleCenterY"
newConstraint.isActive = true
return
}
}
2.頂部展開收起動畫
NSLayoutConstraint是表示約束的類署鸡。就像任何其他按鈕、圖像視圖或標(biāo)簽一樣镐躲，你也可以創(chuàng)建約束的outlet储玫。
//改變頂部視圖的高度約束
menuHeightConstraint.constant = isMenuOpen ? 200.0 : 60.0
titleLabel.text = isMenuOpen ? "Select Item" : "Packing List"
3.加號按鈕變x號
//旋轉(zhuǎn)按鈕
UIView.animate(withDuration: 1.0, delay: 0.0,
usingSpringWithDamping: 0.4, initialSpringVelocity: 10.0,
options: .curveEaseIn,
animations: {
//add
let angle: CGFloat = self.isMenuOpen ? .pi / 4 : 0.0
self.buttonMenu.transform = CGAffineTransform(rotationAngle: angle)
},completion: nil)
4.最重要的一步
//在第三步中 //add處添加這一行
//因?yàn)椋汶m然更新了約束值萤皂，
//但是iOS還沒有更新布局撒穷，在閉包中調(diào)用layoutIfNeeded()，重新布局裆熙，才能顯示動畫效果
self.view.layoutIfNeeded()
