SnapKit入门教程

安装

假设你已经安装好CocoaPods

为了在你的项目中引入SnapKit，你需要写好Podfile

点击查看代码

# Uncomment the next line to define a global platform for your project
platform :ios, '14.2'

target 'MySnapKit' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!
  
  pod 'SnapKit', '~> 5.0.0'

  # Pods for MySnapKit

  target 'MySnapKitTests' do
    inherit! :search_paths
    # Pods for testing
  end

  target 'MySnapKitUITests' do
    # Pods for testing
  end

end

然后运行 pod install

基础使用

OK，现在项目已经集成了SnapKit,下面来看一下基础的用法！

• 首先在使用的文件中导入SnapKitimport SnapKit
• 注意：在使用SnapKit之前一定要把相关子控件先添加到父View；在使用SnapKit之前一定要把相关子控件先添加到父View；在使用SnapKit之前一定要把相关子控件先添加到父View；

居中显示：下面的案例是创建一个box的View，设置宽高为100，在父View中居中显示。

点击查看代码

import UIKit
import SnapKit
class FirstViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        let box = UIView()
        box.backgroundColor = UIColor.blue
        self.view.addSubview(box)
        box.snp.makeConstraints { (make) in
            // 宽高设置为100
            make.size.equalTo(100)
            // 在父视图居中显示
            make.center.equalToSuperview()
            
            // 或者这样写
            //make.size.equalTo(CGSize(width: 100, height: 100))
            //make.center.equalTo(view)
    
        }
    }
}

相对间隔：subView1头部距离subView2底部30

点击查看代码

let button = UIButton(type: .custom)
    button.backgroundColor = UIColor.blue
    button.addTarget(self, action: #selector(buttonClick), for: .touchUpInside)
    bgView.addSubview(button)
    button.snp.makeConstraints { (make) in
        make.size.equalTo(CGSize(width: 100, height: 100))
        make.center.equalTo(bgView)
    }
        
    let bottomLabel = UILabel(frame: .zero)
    bottomLabel.text = "bottomLabel"
    bottomLabel.backgroundColor = UIColor.orange
    bgView.addSubview(bottomLabel)
    bottomLabel.snp.makeConstraints { (make) in
        make.top.equalTo(button.snp.bottom).offset(30) //注意此处button后面要加snp，否则是不起作用的
        make.size.equalTo(CGSize(width: 200, height: 50))
        make.centerX.equalTo(button)
    }

设置四边边距：设置一个子view的四边内边距据父view都为20

点击查看代码

button.snp.makeConstraints { (make) in
    make.edges.equalTo(bgView).inset(UIEdgeInsetsMake(20, 20, 20, 20))
    }

//上面代码和注释代码等同    
//        box.snp.makeConstraints { (make) -> Void in
//            make.top.equalTo(superview).offset(20)
//            make.left.equalTo(superview).offset(20)
//            make.bottom.equalTo(superview).offset(-20)
//            make.right.equalTo(superview).offset(-20)
//        }

不只是等于：SnapKit不仅仅可以设置等于，它也可以设置小于等于、大于等于和设定一个范围； 并且它还支持给left/right/centerY等属性设置上面的用法

点击查看代码

let fzhLabel = UILabel()
    fzhLabel.text = "Dota2"
    fzhLabel.textColor = UIColor.black
    fzhLabel.backgroundColor = UIColor.blue
    fzhLabel.font = UIFont.systemFont(ofSize: 18)
    bgView.addSubview(fzhLabel)

    fzhLabel.snp.makeConstraints { (make) in
        make.left.top.equalTo(bgView).offset(20)
        make.height.equalTo(20)
        //设置label的最大宽度为200
        make.width.lessThanOrEqualTo(200)
}
//设置label的最小宽度为200
make.width.greaterThanOrEqualTo(200)
//设置label最小宽度为50，最大宽度为100
make.width.greaterThanOrEqualTo(50)
make.width.lessThanOrEqualTo(100)
//设置view的left小于等于该view的父view的左 + 10（view.left <= view.superview.left + 10）
make.left.lessThanOrEqualTo(10)

设置优先级：SnapKit也支持设置优先级，它可以放在约束链的最后，它既可以设置具体的值也可以使用枚举（.low, .medium, .high, .require）

点击查看代码

make.left.equalTo(label.snp.left).priority(500)
make.left.equalTo(label.snp.left).priority(.high)

相对宽度或高度：dividedBy(x)是除以x，multipliedBy(x)是乘以x.

点击查看代码

class FirstViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        let box = UIView()
        box.backgroundColor = UIColor.blue
        self.view.addSubview(box)
        box.snp.makeConstraints { (make) in
            // 在父视图居中显示
            make.center.equalToSuperview()
            // 宽度等于父视图宽度的1/2
            make.width.equalToSuperview().dividedBy(2)
            // 高度等于父视图高度的0.25
            make.height.equalToSuperview().multipliedBy(0.25)
        }
    }
}

注意事项

• 该库支持iOS的最低版本是iOS8，所以iOS8以下是无法使用的

• 在使用SnapKit之前一定要把相关子控件先添加到父View
• SnapKit不支持IB
• SnapKit支持make.xxx.xxx.equalTo(bgView).offset(20)的用法，如:make.left.top.equalTo(bgView).offset(20)(该控件的左和上距bgview左和上偏移量为20)

官方文档

• SnapKit Github地址
• SnapKit Document

 

转载自：https://juejin.cn/post/6844903615191056397

原编辑时间 2020-11-30