本文就簡單介紹一下SnapKit基本的使用蔗喂。就說明一下視每種視圖之間關(guān)系的情況下再姑，怎么建立約束，從而見見了解SnapKit编整。都是一些基本用法 舔稀。
以前使用過Masonry、SDAutoLayout會容易比較容易上手的
第一種情況 掌测、父視圖包含子視圖内贮，子視圖在父視圖中的布局(常用的有3種寫法)
寫法一
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖 --- 重點在這里
box1.snp.makeConstraints { (make) in
make.center.equalToSuperview() //設(shè)置中心點，為父視圖的中心點
make.width.height.equalTo(200)//設(shè)置大小為200*200 等價make.size.equalTo(200)
}
let label = UILabel()
label.text = "第一種"
self.view.addSubview(label)
label.snp.makeConstraints { (make) in
make.center.equalToSuperview()
}
}
IMG_1479.PNG
寫法二
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖 --- 重點在這里
box1.snp.makeConstraints { (make) in
make.centerY.equalToSuperview() //設(shè)置中心點的Y點汞斧，為父視圖的Y軸中點
make.left.equalToSuperview().offset(10) //設(shè)置左邊距離父視圖為10 ）
make.right.equalToSuperview().offset(-10) //設(shè)置有邊距離父視圖為10 （這句代碼是右邊距離父視圖的寬度為參照 -10 就是往左減少10夜郁。10就是向右增加10）
make.height.equalTo(100) //設(shè)置高度為100
}
let label = UILabel()
label.text = "第二種"
self.view.addSubview(label)
label.snp.makeConstraints { (make) in
make.center.equalToSuperview()
}
}
IMG_1480.PNG
寫法三
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖 --- 重點在這里
box1.snp.makeConstraints { (make) in
//這個是最簡單的，就是距離父視圖的上下左右的距離
make.edges.equalToSuperview().inset(UIEdgeInsets(top: 100, left: 10, bottom: 10, right: 10))
}
let label = UILabel()
label.text = "第三種"
self.view.addSubview(label)
label.snp.makeConstraints { (make) in
make.center.equalToSuperview()
}
}
IMG_1481.PNG
第二種情況 断箫、兩個子視圖之間的關(guān)系進行布局(這個變化就多了拂酣，大家多多意會，我只寫當前的給大家參考)
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
let box2 = UIView()
box2.backgroundColor = UIColor.red
bgView.addSubview(box2)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖
box1.snp.makeConstraints { (make) in
make.top.equalToSuperview().offset(50)
make.left.equalToSuperview().offset(0)
make.width.equalTo(150)
make.height.equalTo(100)
}
//第二個子視圖 -- 重點在這里
box2.snp.makeConstraints { (make) in
make.top.equalTo(box1.snp.top).offset(20) //top等于box1.top仲义，再向下偏離20
make.left.equalTo(box1.snp.right).offset(10)//let等于box1.right 在向右偏離 10
make.size.equalTo(box1.snp.height) //他的寬高都等于 box1.height
}
}
IMG_1482.PNG
關(guān)鍵字 multipliedBy,dividedBy 也比較常用
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
let box2 = UIView()
box2.backgroundColor = UIColor.red
bgView.addSubview(box2)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖
box1.snp.makeConstraints { (make) in
make.top.equalToSuperview().offset(50)
make.left.equalToSuperview().offset(10)
make.width.height.equalTo(100)
}
//第二個子視圖 -- 重點在這里
box2.snp.makeConstraints { (make) in
make.top.equalTo(box1.snp.top).dividedBy(2) //頂部的距離等于box1.top*2
make.right.equalToSuperview().offset(-10)
make.height.equalTo(box1.snp.height).multipliedBy(0.5) //他的寬高都等于 box1.height*0.5
make.left.equalTo(box1.snp.left).dividedBy(0.5) //left等于box1.left?0.5
}
}
關(guān)鍵字 multipliedBy,dividedBy
priority 優(yōu)先級用法 婶熬，SnapKit一共提供了4種優(yōu)先級，優(yōu)先級順序是：required > high > medium > low埃撵。
func testDemo(){
let bgView = UIView()
bgView.backgroundColor = UIColor.yellow
self.view.addSubview(bgView)
let box1 = UIView()
box1.backgroundColor = UIColor.blue
bgView.addSubview(box1)
//父視圖
bgView.snp.makeConstraints { (make) in
make.center.equalToSuperview()
make.size.equalTo(350)
}
//第一個子視圖
box1.snp.makeConstraints { (make) in
make.center.equalToSuperview().priority(.medium)
make.right.equalToSuperview().offset(-10).priority(.high) //高于center 赵颅，肯定靠左
make.top.equalToSuperview().offset(10).priority(.low) //低于center，肯定居中
// size 和center 的優(yōu)先級沒啥沖突暂刘，不考慮 饺谬。但是自身的優(yōu)先級還是要考慮的
make.size.equalTo(100).priority(.medium) //優(yōu)先級高 size = 100*100
make.size.equalTo(200).priority(.low)
}
}
priority 優(yōu)先級用法
