Swift自动布局库SnapKit的约束的更新、移除、重做例子

在之前的文章中我介绍了如何使用SnapKit的 snp_makeConstraints 方法进行各种约束的设置。但有时我们的页面并不是一直固定不变的,这就需要修改已经存在的约束。本文介绍如何更新、移除、代替现有的约束。

1,删除约束

要实现对现有的约束进行更新或者移除,我们需要先将约束的结果赋值给一个局部变量或一个类属性,然后对这个约束的引用进行操作。
比如下面样例:开始时我们给橙色方块添加了个距屏幕上方40像素的约束,点击按钮后使用 uninstall() 方法把这个约束给移除。

import UIKit
import SnapKit
 
class ViewController: UIViewController {
    
    lazy var box = UIView()
    
    //保存约束的引用
    var topConstraint:Constraint?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        box.backgroundColor = UIColor.orangeColor()
        self.view.addSubview(box)
        
        box.snp_makeConstraints { (make) -> Void in
            make.width.height.equalTo(150)
            make.centerX.equalTo(self.view)
            self.topConstraint = make.top.equalTo(self.view).offset(40).constraint
        }
    }
    
    //按钮点击
    @IBAction func btnTouch(sender: AnyObject) {
        //移除约束
        self.topConstraint?.uninstall()
    }
}

2,通过约束的引用来更新约束
还是以上面距屏幕上方40像素的约束为例,点击按钮后,通过调用约束引用的 updateOffset() 方法把距离修改成60像素。

import UIKit
import SnapKit
 
class ViewController: UIViewController {
    
    lazy var box = UIView()
    
    //保存约束的引用
    var topConstraint:Constraint?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        box.backgroundColor = UIColor.orangeColor()
        self.view.addSubview(box)
        
        box.snp_makeConstraints { (make) -> Void in
            make.width.height.equalTo(150)
            make.centerX.equalTo(self.view)
            self.topConstraint = make.top.equalTo(self.view).offset(40).constraint
        }
    }
    
    //按钮点击
    @IBAction func btnTouch(sender: AnyObject) {
        //更新修改约束
        self.topConstraint?.updateOffset(60)
    }
}

3,使用snp_updateConstraints更新约束

我们还可以用 snp_updateConstraints 方法来代替 snp_makeConstraints 进行约束的更新,这个更新操作通常放在 UIViewController 的 updateViewConstraints() 方法中,或者 UIView 的 updateConstraints() 方法中执行,这样视图约束需要更新的时候会自动调用。
比如下面样例,我们使用 snp_updateConstraints() 方法设置橙色视图的宽度约束为与屏幕等宽,这样不管设备如何旋转,视图都回自动更新约束撑满屏幕。

import UIKit
import SnapKit
 
class ViewController: UIViewController {
    
    lazy var box = UIView()
    
   
    override func viewDidLoad() {
        super.viewDidLoad()
        
        box.backgroundColor = UIColor.orangeColor()
        self.view.addSubview(box)
        
        box.snp_makeConstraints { (make) -> Void in
            make.height.equalTo(150)
            make.centerX.equalTo(self.view)
        }
    }
  
    //视图约束更新
    override func updateViewConstraints() {
        self.box.snp_updateConstraints{ (make) -> Void in
            //视图宽度与屏幕等宽
            make.width.equalTo(self.view)
        }
  
        super.updateViewConstraints()
    }
}

4,使用snp_remakeConstraints重做约束
snp_remakeConstraints 与 snp_makeConstraints 用法类似,不同的是 snp_remakeConstraints 首先会先清除掉之前所有被SnapKit设置的约束。

下面样例:初始化时橙色视图约束是宽高150,水平居中。点击按钮后重做约束,宽高变100,且不再居中。
     

import UIKit
import SnapKit
 
class ViewController: UIViewController {
    
    lazy var box = UIView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        box.backgroundColor = UIColor.orangeColor()
        self.view.addSubview(box)
        
        box.snp_makeConstraints { (make) -> Void in
            make.width.height.equalTo(150)
            make.centerX.equalTo(self.view)
        }
    }
  
    //按钮点击
    @IBAction func btnTouch(sender: AnyObject) {
        //重做约束
        box.snp_remakeConstraints { (make) -> Void in
            make.width.height.equalTo(100)
        }
    }
}

时间: 2024-08-01 21:47:52

Swift自动布局库SnapKit的约束的更新、移除、重做例子的相关文章

Swift自动布局库SnapKit的约束优先级,约束做动画使用详解

1,约束优先级 我们使用SnapKit的时候,还可以定义约束的优先级.这样当约束出现冲突的时候,优先级高的约束覆盖优先级低的约束.具体优先级可以放在约束链的结束处. (1)可以设置如下几种优先级 priorityLow():设置低优先级,优先级为250 priorityMedium():设置中优先级,优先级为500(这个也就是默认的优先级) priorityHigh():设置高优先级,优先级为750 priority():可以设置任意的优先级,接受的参数是0-1000的数字.比如:priorit

Swift 自动布局库SnapKit的实现一个登录页面使用详解

前面的几篇文章讲解了自动布局库SnapKit的使用方法.本文通过一个完整的样例(登录页面)来演示在实际项目中如何使用SnapKit来实现自动化布局的. 1,效果图如下 2,代码讲解 (1)用户名.密码输入区域(白色区域)设置垂直居中约束,其高度是固定90,宽度自适应(距离屏幕左右侧都为15像素) (2)用户名.密码输入框之间分割线是使用灰色背景的UIView实现,其高度是1像素,同样设置垂直居中约束. (3)登录按钮距离上方输入区域20像素,高度固定是40,宽度同样自适应(距离屏幕左右侧都为15

Swift 自动布局库SnapKit的使用详解1(配置、使用方法、样例)

了适应各种屏幕尺寸,iOS 6后引入了自动布局(Auto Layout)的概念,通过使用各种 Constraint(约束)来实现页面自适应弹性布局.(想了解更多可查看我原来写的这篇文章:Swift - 使用Auto Layout和Size Classes实现页面自适应弹性布局) 在 StoryBoard 中使用约束实现自动布局很方便,但如果用纯代码来设置约束就很麻烦了.这里向大家推荐一个好用的第三方布局库:SnapKit(其前身是 Masonry,一个OC版的布局库) 1,SnapKit介绍 

Masonry自动布局详解二:动画更新约束

Masonry自动布局详解二:动画更新约束 说到iOS自动布局,有很多的解决办法.有的人使用xib/storyboard自动布局,也有人使用frame来适配.对于前者,笔者并不喜欢,也不支持.对于后者,更是麻烦,到处计算高度.宽度等,千万大量代码的冗余,对维护和开发的效率都很低. 笔者在这里介绍纯代码自动布局的第三方库:Masonry.这个库使用率相当高,在全世界都有大量的开发者在使用,其star数量也是相当高的. 支持原创,请阅读原文 效果图 本节详解Masonry的以动画的形式更新约束的基本

[快速学会Swift第三方库] Cartography篇

[快速学会Swift第三方库] Cartography篇 Cartography 是用来声明 Swift 中的 Auto Layout,无需输入任何 stringly 就可设置自己 Auto Layout 的约束声明. 目录 快速学会Swift第三方库 Cartography篇 目录 编码之前 导入 Cartography 其他操作 基本约束 示例代码 运行结果 替换约束 示例代码 运行结果 复合约束与对齐 示例代码 运行结果 边距 示例代码 运行结果 深入学习 编码之前 导入 Cartogra

[快速学会Swift第三方库] Eureka篇

[快速学会Swift第三方库] Eureka篇 Eureka可以帮你简单优雅的实现动态table-view表单.它由rows,sections和forms组成.如果你的app包含大量表单,Eureka可以真正帮你节省时间. 目录 快速学会Swift第三方库 Eureka篇 目录 编码之前 导入 Eureka 其他操作 创建表单 基础表单 选择类型表单 Segment风格选择器 标准选择器 pickerView风格选择器 三种风格选择器效果对比 带输入框的表单 自定义Row 深入学习 编码之前 导

[快速学会Swift第三方库] HanekeSwift篇

[快速学会Swift第三方库] HanekeSwift篇 Haneke是一个轻量级的缓存,为UIImage,JSON,NSData,String提供记忆和LRU磁盘缓存. 目录 快速学会Swift第三方库 HanekeSwift篇 目录 编码之前 导入HanekeSwift 其他操作 使用缓存 NSData 示例代码 运行结果 JSON 测试接口 示例代码 运行结果 UIImage和String UIImage的拓展用法 示例代码 运行结果 fetcher的其他用法 深入学习 编码之前 编码之前

[快速学会Swift第三方库] SwiftyJSON篇

[快速学会Swift第三方库] SwiftyJSON篇 SwiftyJSON使得用Swift处理JSON数据更加容易.这是解析JSON字符串封装类.实现功能与Javascript中的JSON.parse相近,使用方便. 目录 快速学会Swift第三方库 SwiftyJSON篇 目录 编码之前 导入SwiftyJSON 其他操作 解析本地JSON 示例JSON 示例代码 运行结果 解析网络JSON 示例JSON 示例代码 运行结果 深入学习 编码之前 导入SwiftyJSON 推荐使用CocoaP

[快速学会Swift第三方库] Alamofire篇

[快速学会Swift第三方库] Alamofire篇 Alamofire是 Swift 语言的 HTTP 网络开发工具包,AFNetworking的 Swift 版,使用起来相当简单. 目录 快速学会Swift第三方库 Alamofire篇 目录 编码之前 导入Alamofire 其他操作 Web请求 示例代码 运行结果 数据请求JSON 示例代码 运行结果 上传文件 示例代码 运行结果 下载文件 示例代码 运行结果 深入学习 编码之前 导入Alamofire 推荐使用CocoaPods进行导入