IOS-SnapKit简单使用-Swift

饼子会飞

已于 2024-01-17 08:25:15 修改

阅读量753

点赞数 14

分类专栏： IOS-Swift学习文章标签： ios SnapKit

于 2024-01-12 10:44:33 首次发布

本文链接：https://blog.csdn.net/butterfly_new/article/details/135546716

版权

IOS-Swift学习专栏收录该内容

19 篇文章 0 订阅

订阅专栏

本文介绍了如何在Swift中使用SnapKit进行自动布局，展示了如何添加和约束UISearchBar、UITableView、UISlider和UILabel，以实现特定界面布局。

摘要由CSDN通过智能技术生成

SnapKit是Swift的一个自动布局的框架，简答好用，代码量还少，地址：https://github.com/SnapKit/SnapKit

使用方法

向页面添加view：

		let search=UISearchBar()
        search.placeholder="搜索视频"
        
        let table=UITableView()
        table.backgroundColor=UIColor.blue

        let slider1=UISlider()
        let slider2=UISlider()
        
        let label=UILabel()
        label.text="筛选"
        
        self.view.addSubview(table)
        self.view.backgroundColor=UIColor.white
        self.view.addSubview(search)
        self.view.addSubview(slider1)
        self.view.addSubview(slider2)
        self.view.addSubview(label)

添加约束：

		search.snp.makeConstraints({
            (make) in
            //宽度与父布局一致
            make.width.equalToSuperview()
            //高度为50
            make.height.equalTo(50)
            //顶部在安全区域的顶部
            make.top.equalTo(view.safeAreaLayoutGuide.snp.top)
        })
        slider1.snp.makeConstraints({
            (make) in
            //顶部在搜索框的底部，距离5
            make.top.equalTo(search.snp.bottom).offset(5)
            //宽度50
            make.width.equalTo(50)
            //左边与父布局一致，即贴紧父布局左侧
            make.left.equalToSuperview()
        })
        slider2.snp.makeConstraints({
            (make) in
            //顶部在搜索框的底部，距离5
            make.top.equalTo(search.snp.bottom).offset(5)
            //宽度50
            make.width.equalTo(50)
            //左边在slider1的后边，距离10，即跟在slider1的后面，间隔10
            make.leading.equalTo(slider1.snp.trailing).offset(10)
        })
        table.snp.makeConstraints{
            (make)in
            //宽度与父布局一致
            make.width.equalToSuperview()
            //顶部在slider1的底部，距离10
            make.top.equalTo(slider1.snp.bottom).offset(10)
            //底部在安全区域的底部
            make.bottom.equalTo(view.safeAreaLayoutGuide.snp.bottom)
        }
        
        label.snp.makeConstraints({
            (make) in
            //顶部在搜索框的底部，距离5
            make.top.equalTo(search.snp.bottom).offset(5)
            //右边与父布局一致，距离10
            make.right.equalToSuperview().inset(10)
        })