本文就簡單介紹一下SnapKit基本的使用。就說明一下視每種視圖之間關系的情況下，怎么建立約束，從而見見了解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() //設置中心點，為父視圖的中心點
            make.width.height.equalTo(200)//設置大小為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()  //設置中心點的Y點，為父視圖的Y軸中點
            make.left.equalToSuperview().offset(10) //設置左邊距離父視圖為10 ）
            make.right.equalToSuperview().offset(-10) //設置有邊距離父視圖為10 （這句代碼是右邊距離父視圖的寬度為參照 -10 就是往左減少10。10就是向右增加10）
            make.height.equalTo(100) //設置高度為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

第二種情況 、兩個子視圖之間的關系進行布局(這個變化就多了，大家多多意會，我只寫當前的給大家參考)

    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

關鍵字 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
     }
}

關鍵字 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)先級用法