SwiftSnapKit自动布局的使用

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› 移动开发›Swift 教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

这里只有一切基础的Demo，后期会继续更新的

举例说明，创建一个红色UIView，居中，宽高都是50

        let redView : UIView = UIView.init()
        redView.backgroundColor = UIColor.red
        self.view.addSubview(redView)
        redView.snp.makeConstraints { (make) in
            make.width.height.equalTo(50) //宽度和高度设置为50
            make.center.equalTo(self.view)//在self.view上居中
        }

创建一个红色UIView，顶部100，左右间距各10，高度50

        let redView : UIView = UIView.init()
        redView.backgroundColor = UIColor.red
        self.view.addSubview(redView)
        redView.snp.makeConstraints { (make) in
            make.height.equalTo(50)
            make.top.equalTo(100)
            make.left.equalTo(10)
            make.right.equalTo(-10)
        }

创建一个蓝色的UIView，顶部在红色view的底部，做间距和宽度和红色view一样，高度是红色view的一半，以下两个demo是等价的

        let blue : UIView = UIView.init()
        blue.backgroundColor = UIColor.blue
        self.view.addSubview(blue)
        blue.snp.makeConstraints { (make) in
            make.top.equalTo(redView.snp.bottom)
            make.left.equalTo(redView.snp.left)
            make.width.equalTo((redView.snp.width))
            make.height.equalTo((redView.snp.height)).multipliedBy(0.5)
        }

       let blue : UIView = UIView.init()
        blue.backgroundColor = UIColor.blue
        self.view.addSubview(blue)
        blue.snp.makeConstraints { (make) in
            make.top.equalTo(redView.snp.bottom)
            make.left.equalTo(redView)
            make.width.equalTo((redView))
            make.height.equalTo((redView)).multipliedBy(0.5)
        }

创建一个蓝色的UIView，left，top，bottom，right都和redView相等

        let blue : UIView = UIView.init()
        blue.backgroundColor = UIColor.blue
        self.view.addSubview(blue)
        blue.snp.makeConstraints { (make) in
            make.edges.equalTo(redView)
        }

创建一个blueView，相对于父视图left，top，bottom，right都是10

      let blue : UIView = UIView.init()
        blue.backgroundColor = UIColor.blue
        self.view.addSubview(blue)
        blue.snp.makeConstraints { (make) in
            make.edges.equalTo(self.view).inset(UIEdgeInsets.init(top: 10, left: 10, bottom: 10, right: 10))
        }

创建一个居中的lab，并设置最大或者最小的宽度

        let lab:UILabel = UILabel.init()
        lab.textAlignment = .center
        lab.backgroundColor = UIColor.red
        lab.numberOfLines = 0
        lab.text = "我是一个UILabel"
        self.view.addSubview(lab)
        lab.snp.makeConstraints { (make) in
            make.center.equalTo(self.view)
//            make.width.greaterThanOrEqualTo(200)//最小的宽度是200
            make.width.lessThanOrEqualTo(20)//最大的宽度是20
        }

创建一个居中的lab，高度父视图的高度-100

        let lab:UILabel = UILabel.init()
        lab.textAlignment = .center
        lab.backgroundColor = UIColor.red
        lab.numberOfLines = 0
        lab.text = "我是一个UILabel"
        self.view.addSubview(lab)
        lab.snp.makeConstraints { (make) in
            make.height.equalToSuperview().offset(-100)
            make.center.equalToSuperview()
        }

创建一个居中的lab，高度比redView高50

        let lab:UILabel = UILabel.init()
        lab.textAlignment = .center
        lab.backgroundColor = UIColor.red
        lab.numberOfLines = 0
        lab.text = "我是一个UILabel"
        self.view.addSubview(lab)
        lab.snp.makeConstraints { (make) in
            make.height.equalTo(redView).offset(50)
            make.center.equalToSuperview()
        }