interfaceBuilder 自动布局的约束
假设在xib中放入一个textview,那我们需要让它在屏幕上完全显示。
设置textview的绝对位置,在iPhone4上一点对应2个像素，而在iphone6或者是在iphone6s上对应的将是3个像素，如是进行横竖屏切换，显然iphone4的像素显然就不合适了
textview.png
如何对控件添加约束
其实苹果默认识对每一个控件进行自动的auto layout ，trait variations 的，只是这种默认的视图大小是600*600的尺寸，显然这个大小也是不合适的
系统默认的布局.png
使用约束布局一个界面
*注意点一：为textvie w添加约束后，就不可以在设置控件的frame。以后的动画也需要根据约束进行操作。
*注意点二：每一条约束就相当于一个等式
设置控件的约束.png
改变约束的高度
设置约束的高度.png
在view上放置一个label,为 label添加约束，右键label拖向view控件，松手。
注意点：蓝色的指示线代表正常的约束，橘黄色的约束代表的是约束被破坏了。
破坏的约束视图.png
解决办法：
解决png
此时，label于view之间约束的关系为：
label于vie w约束的关系.png
修改label的center的位置
修改label的位置约束.png
为vie w添加一个约束，为but ton添加约束
注意点：添加同级约束，label和button之间约束时，仍然是从lab e l右键拖至label，松手
注意点2:修改同级约束的值，仍然是相同的做法，而此时，我们要的是label按照label进行对齐。因此，first iterm应该是button，seconditerm应该是label
为控制器视图添加一个tabelview，设置约束
注意点：此时的ta be view 设置的top bottom属性都是根据它最近的控件进行的设置。left right属性是相对于父视图进行的设置
ta be view注意点视图.png
自动布局的方法就这样了，接下来就是如何利用约束创建动画
让autolayout正常工作，我们不可以直接的操作视图的frame属性，只可以利用约束创建autolayout动画
首先做一个点击button按钮，让view的高度变化，再次点击button，高度返回原来的值。
创建一个NSLayoutConstraint属性并关联导航的高度约束
@IBOutlet var menuHeightConstraint : NSLayoutConstraint!
关联高度.png
@IBAction func actionToggleMenu(_ sender: Any) { isMenuOpen = !isMenuOpen menuHeightConstraint.constant = isMenuOpen ? 200.0 : 60.0 titleLabel.text = isMenuOpen ? "select iterm" : "packing list" }
注意点：我们修改了约束后，视图的布局并不会立即进行刷新，重绘。只是进行一次标记，会在之后的时间点进行重绘。这个时间点就是在调用layoutifneed方法之后。
核心代码：
UIView.animate(withDuration: 1.0, delay: 0.0, usingSpringWithDamping: 0.4, initialSpringVelocity: 0.4, options: .curveEaseInOut, animations: { () -> Void in self.view.layoutIfNeeded()// }, completion: nil) }
接下来就是让button按钮旋转一个角度：
let angle = self.isMenuOpen ? CGFloat(M_PI_4) : 0.0 self.buttonMenu.transform = CGAffineTransform(rotationAngle: angle)
查看一个控件所有的约束
for con in (titleLabel.superview?.constraints)! { print("->\(con.description)") }
点击button的时候让title label可以向左移动100个点,首先应该从constraints属性中找出这个label，改变它在x轴上的约束
for constraint in titleLabel.superview!.constraints { if constraint.firstItem as? NSObject == titleLabel && constraint.firstAttribute == .centerY { // constraint.constant = isMenuOpen ? 10 : 0.0 } }
那么怎样通过约束修改创建动画呢，可以为每个约束分配一个标示，可以更好地对约束进行管理
约束标示.png
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 continue }
运行效果：
运行效果.gif
网友评论