SnapKit简介
SnapKit是一个优秀的第三方自适应布局库,它可以让iOS、OS X应用更简单地实现自动布局(Auto Layout)
下载链接 SnapKit
SnapKit配置
使用pods方式引入类库,pod 'SnapKit' 引入头文件 import SnapKit
SnapKit使用
示例:
代码语言:javascript复制testView.snp.makeConstraints { (make) in
make.left.equalToSuperview().offset(50)
make.right.equalToSuperview().offset(-50)
make.top.equalToSuperview().offset(50)
make.bottom.equalToSuperview().offset(-50)
}
基本格式:(make . 指定其的一个属性 . 约束关系)
代码语言:javascript复制make.attr.constrains
make:可认为是要布局的view的代理 constrains:约束可能是多级的组合,比如make.left.equalToSuperview().offset(50)的两级组合,显示找到父view的左边位置,再向右(X轴)移动50点
给控件添加、更新约束、引用约束、停用、启用
添加新的约束
代码语言:javascript复制testView.snp.makeConstraints { (make) in
}
删除控件以前所有约束,添加新约束
代码语言:javascript复制testView.snp.remakeConstraints { (make) in
}
更新约束,写哪条更新哪条,其他约束不变
代码语言:javascript复制testView.snp.updateConstraints { (make) in
}
引用约束,声明一个局部变量或者类属性来引用要修改的约束
代码语言:javascript复制var topConstraint: Constraint? = nil
override func viewDidLoad() {
super.viewDidLoad()
let testView = UIView()
testView.backgroundColor = UIColor.red
self.view.addSubview(testView)
testView.snp.makeConstraints { (make) in
self.topConstraint = make.left.equalToSuperview().offset(100).constraint
make.right.equalToSuperview().offset(-100)
make.top.equalToSuperview().offset(100)
make.bottom.equalToSuperview().offset(-100)
}
}
停用
代码语言:javascript复制self.topConstraint?.deactivate()
启用
代码语言:javascript复制self.topConstraint?.activate()
设置约束关系
约束关系 | 说明 |
---|---|
equalTo() | 设置属性等于某个数值 |
greaterThanOrEqualTo() | 设置属性大于或等于某个数值 |
lessThanOrEqualTo() | 设置属性小于或等于某个数值 |
multipliedBy() | 设置属性乘以因子后的值 |
dividedBy() | 设置属性除以因子后的值 |
设置控件布局属性
布局属性 | 说明 |
---|---|
尺寸 | width、height、size |
边距 | left、top、right、bottom、leading、trailing |
中心点 | center、centerX、centerY |
边界 | edges |
//iOS8之后Masonry新出了几个属性:
//距离边框的距离,等同于选中Storyboard的Constrain to margins后加约束public var leftMargin: SnapKit.ConstraintMakerExtendable { get }
public var rightMargin: SnapKit.ConstraintMakerExtendable { get }
public var topMargin: SnapKit.ConstraintMakerExtendable { get }
public var bottomMargin: SnapKit.ConstraintMakerExtendable { get }
public var leadingMargin: SnapKit.ConstraintMakerExtendable { get }
public var trailingMargin: SnapKit.ConstraintMakerExtendable { get }
public var centerXWithinMargins: SnapKit.ConstraintMakerExtendable { get }
public var centerYWithinMargins: SnapKit.ConstraintMakerExtendable { get }
其中leading与left,trailing与right 在正常情况下是等价的,但是当一些布局是从右至左时(比如阿拉伯文) 则会对调
设置约束偏移
方法 | 参数 | 说明 |
---|---|---|
offset(CGFloat offset) | CGFloat | 控件属性相对于参照物偏移多少 |
insets(MASEdgeInsets insets) | MASEdgeInsets | 控件四边相对于参照物偏移多少 |
offset示例
代码语言:javascript复制testView.snp.makeConstraints { (make) in
make.left.equalToSuperview().offset(20)
make.right.equalToSuperview().offset(-20)
make.top.equalToSuperview().offset(20)
make.bottom.equalToSuperview().offset(-20)
}
insets示例
代码语言:javascript复制//具体父控件四周都是20间距
testView.snp.makeConstraints { (make) in
make.edges.equalToSuperview().inset(UIEdgeInsets.init(top: 20, left: 20, bottom: 20, right: 20))
}
设置约束优先级
SnapKit为我们提供了三个默认的方法,required、high、medium、low,优先级最大数值是1000
代码语言:javascript复制public static var required: ConstraintPriority {
return 1000.0
}
public static var high: ConstraintPriority {
return 750.0
}
public static var medium: ConstraintPriority {
#if os(OSX)
return 501.0
#else
return 500.0
#endif
}
public static var low: ConstraintPriority {
return 250.0
}
自己设置优先级的值,可以通过priority()方法来设置
代码语言:javascript复制testView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.width.equ alTo(100).priority(ConstraintPriority.low)
make.width.equalTo(100).priority(ConstraintPriority.high)
make.height.equalTo(100).priority(200)
make.height.equalTo(50).priority(800)
}
代码语言:javascript复制----
SnapKit注意
- 使用SnapKit添加约束之前,需要在addSubview之后才能使用,否则会导致崩溃
- 在添加约束时常会出现一些错误,约束出现问题的原因一般就是两种:约束冲突和缺少约束。对于这两种问题,可以通过调试和log排查