【iOS 基础】UI相关 - 布局约束

原创
2021/03/07 10:10
阅读数 82

Pre

  • macos Version : Big Sur 11.2.1
  • Xcode Version : 12.4
  • Language :Swift
  • Language Version : 5.3.2

NSLayoutConstraint

初始化方法

// API
public convenience init(item view1: Any, 
		   attribute attr1: NSLayoutConstraint.Attribute,
		relatedBy relation: NSLayoutConstraint.Relation,
		      toItem view2: Any?,
		   attribute attr2: NSLayoutConstraint.Attribute,
			multiplier: CGFloat,
			constant c: CGFloat)

调用【为父视图添加约束】

self.view.addSubView(self.scrollView)
let centerX  = NSLayoutConstraint.init(item: self.scrollView,
				  attribute: NSLayoutConstraint.Attribute.centerX,
				  relatedBy: NSLayoutConstraint.Relation.equal,
				     toItem: self.view,
				  attribute: NSLayoutConstraint.Attribute.centerX,
				 multiplier: 1,
				   constant: 0)

self.view.addConstraints(centerX)
self.scrollView.translatesAutoresizingMaskIntoConstraints = false

调用【为自身添加约束】

let width_s  = NSLayoutConstraint(item: self.scrollView,
			     attribute: .width,
			     relatedBy: .equal,
				toItem: nil,
			     attribute: .notAnAttribute,
			    multiplier: 1,
			      constant: 414)
self.scrollView.addConstraint(width_s)

参数解析

  1. item view1 : Any :视图1
  2. attribute attr1: NSLayoutConstraint.Attribute:要约束的视图1的属性,列表如下
// NSLayoutConstraint.Attribute
public enum Attribute : Int {
        case left = 1
        case right = 2
        case top = 3
        case bottom = 4
        case leading = 5
        case trailing = 6
        case width = 7
        case height = 8
        case centerX = 9
        case centerY = 10
        case lastBaseline = 11
        case firstBaseline = 12
        case leftMargin = 13
        case rightMargin = 14
        case topMargin = 15
        case bottomMargin = 16
        case leadingMargin = 17
        case trailingMargin = 18
        case centerXWithinMargins = 19
        case centerYWithinMargins = 20   
        case notAnAttribute = 0
    }
  1. relatedBy relation: NSLayoutConstraint.Relation:视图1的属性与视图2的属性的关系
// NSLayoutConstraint.Relation
public enum Relation : Int {
    case lessThanOrEqual = -1
    case equal = 0
    case greaterThanOrEqual = 1
}
  1. toItem view2: Any?:视图2
  2. attribute attr2: NSLayoutConstraint.Attribute:与视图2的哪个属性进行约束
  3. multiplier: CGFloat:倍数
  4. constant c: CGFloat:加上多少
  • 总的来说就是:view1的属性 = view2的属性加/减/乘/除 多少
    item1.attribute1 = multiplier × item2.attribute2 + constant

translatesAutoresizingMaskIntoConstraints

  • 字面意思:将自动调整蒙版大小转换为约束
  • 当我们执行self.view.addSubView(self.scrollView)时,系统会自动给autoresizing约束,如果我们想要用代码来约束布局的话,就必须设置translatesAutoresizingMaskIntoConstraintsfalse(也就是取消系统自动为我们的视图添加的autoresizing约束),否则程序将崩溃

官方注释
When you elect to position the view using auto layout by adding your own constraints, you must set this property to NO.
当您选择通过添加您自己的约束来使用自动布局来定位视图时,必须将此属性设置为NO。

总结

  1. 通过NSLayoutConstraint可以为视图添加布局约束
  2. 若是子视图自身布局约束(设置绝对宽度、绝对高度等),将约束添加给自身
  3. 若是为子视图添加与父视图相关的布局约束,将约束添加给父视图
  4. addSubView(),添加约束
  5. 需将被我们的代码设置布局约束的视图的translatesAutoresizingMaskIntoConstraints属性设置为false
展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部