使用VFL创建约束对象

简介: 使用VFL创建约束对象

在使用Autolayout进行视图布局时,NSLayoutConstraint对象是非常常用的,我们知道NSLayoutConstraint对象的创建需要很多的参数,而且在对一个视图进行自动布局时,通常需要创建大量的NSLayoutConstraint对象,这是非常烦琐且不直观的。为了解决这种尴尬的情况,Apple开发了一种新的描述语言VFL(VisualFormat Language,可视化格式语言),用来帮助开发者可视化的、快速的创建约束对象。

VFL使用字符串来描述组件间的约束关系,之后由解析引擎生成一组真实的NSLayoutConstraint约束对象。

在VFL语言中,首先需要指明布局的方向,即是水平方向的布局还是竖直方向的布局,水平方向使用“H:”表示,竖直方向使用“V:”表示。另外,使用“-”表示组件间的间距,使用“|”表示组件的边界。下面的代码演示了如何使用VFL进行约束对象的创建:

self.view.translatesAutoresizingMaskIntoConstraints = false
    let v1 = UIView()
    v1.backgroundColor = UIColor.red
    let v2 = UIView()
    v2.backgroundColor = UIColor.blue
    let v3 = UIView()
    v3.backgroundColor = UIColor.green
    v1.translatesAutoresizingMaskIntoConstraints = false;
    v2.translatesAutoresizingMaskIntoConstraints = false;
    v3.translatesAutoresizingMaskIntoConstraints = false;
    self.view.addSubview(v1)
    elf.view.addSubview(v2)
    self.view.addSubview(v3)
    // 使用VFL创建约束对象
    let hArray = NSLayoutConstraint.constraints(withVisualFormat:
"H:|-10-[v1]-10-[v2(==v1)]-10-[v3(==v2)]-10-|", options:
[.alignAllTop, .alignAllBottom], metrics: nil, views: ["v1":v1, "v2":v2, "v3":v3])
    let vArray = NSLayoutConstraint.constraints(withVisualFormat:
"V:|-100-[v1(100@1000)]", metrics: nil, views: ["v1":v1])
    NSLayoutConstraint.activate(hArray)
    NSLayoutConstraint.activate(vArray)


上面的v1、v2、v3都是视图代号,在其后的小括号中可以对视图的宽度/高度和约束优先级进行设置。运行代码,布局效果如图所示。


1684485692634.png


布局效果

在上面的代码中,constraints类方法用来将VFL字符串解析成约束对象,这个方法的完整定义如下:

open class func constraints(withVisualFormat format: String, options opts:
NSLayoutConstraint.FormatOptions = [], metrics: [String : Any]?, views: [String :
Any]) -> [NSLayoutConstraint]


在上面的方法中,参数format为VFL语言的字符串,opts参数用来设置视图的对齐方式,metrics参数用来指定变量列表,如果VFL中有使用到变量作为约束值,则需要在metrics字典中进行指定,views用来指定视图列表。例如,VFL字符串中使用的间距10是某个变量提供的,则可以改写如下:

let spec = 10;
let hArray = NSLayoutConstraint.constraints(withVisualFormat:
"H:|-spec-[v1]-spec-[v2(==v1)]-spec-[v3(==v2)]-spec-|", options:
[.alignAllTop, .alignAllBottom], metrics: ["spec": spec], views: ["v1":v1, "v2":v2,
"v3":v3])


在使用VFL生成约束对象时,还有一点需要注意,constraints类方法的opts参数用来指定布局次轴方向上的视图对齐方式。次轴方向是指与布局方向垂直的方向:对于水平方向的布局,次轴方向就是竖直方向;对于竖直方向,次轴方向就是水平方向。

VFL虽然写着简单,但并不是万能的,当视图间的关系需要以比例的方式进行约束时,VFL就无能为力了。其实在实际开发中VFL使用的并不多,对于自动布局,更多的是借助成熟的第三方库来创建约束。但是对VFL的熟悉与理解依然十分重要,当因为布局冲突产生运行时问题时,控制台会打印相关的约束对象,打印时就会将布局的信息以VFL字符串的方式输出,熟悉它可以帮助我们更好地发现布局问题。

目录
相关文章
|
存储 安全 编译器
【Qt 底层机制之信号和槽 】深入探究Qt信号和槽背后的原理
【Qt 底层机制之信号和槽 】深入探究Qt信号和槽背后的原理
3161 4
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的火车票订票系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的火车票订票系统的详细设计和实现(源码+lw+部署文档+讲解等)
266 1
|
缓存 NoSQL Redis
[Nestjs] 使用redis的基础配置,以及基本使用的介绍
要在 NestJS 中使用 Redis,需要安装依赖npm install --save redis fastify-redis
738 0
|
机器学习/深度学习 存储 人工智能
构建坚不可摧的系统安全防线:策略、实践与未来展望
系统安全是维护社会稳定、保障企业运营和个人隐私的重要基石。构建坚不可摧的系统安全防线需要从多个维度出发制定全面的安全策略并付诸实践。未来随着技术的不断进步和应用场景的不断拓展,系统安全将面临更多的挑战和机遇。只有不断创新和完善安全技术和策略才能应对日益复杂的安全威胁和挑战确保系统的安全和稳定运行。
|
缓存 网络协议 NoSQL
基于UDP的可靠性传输协议-KCP简介
基于UDP的可靠性传输协议-KCP简介
455 0
|
Web App开发 前端开发 Java
Python Selenium自动化测试框架
Python Selenium自动化测试框架
|
机器学习/深度学习 人工智能 算法
AI重建粒子轨迹,发现新物理学
【5月更文挑战第6天】研究人员利用AI重建高能粒子碰撞实验中的粒子轨迹,发现新物理学现象。AI技术解决了传统方法的局限性,揭示了不同寻常的粒子衰变和分布模式,暗示可能存在未知物理过程或粒子相互作用。该研究显示AI在物理学研究中的潜力,但也面临数据需求、计算资源限制和模型可解释性的挑战。[论文链接](https://doi.org/10.7494/csci.2024.25.1.5690)
234 1
|
Unix 编译器 C语言
C++系列-附录-windows下安装C++环境
C++系列-附录-windows下安装C++环境
|
Cloud Native Linux Go
开源项目的资金来源:捐赠、赞助与商业模式
开源项目的资金来源:捐赠、赞助与商业模式
496 0
|
JSON 分布式计算 搜索推荐
【王喆-推荐系统】复习篇-Sparrow的个性化推荐功能
为了训练推荐模型,需要准备好模型所需的样本和特征。在进行模型线上推断的时候,推荐服务器也需要线上实时拼装好包含了用户特征、物品特征、场景特征的特征向量,发送给推荐模型进行实时推断。
643 0
【王喆-推荐系统】复习篇-Sparrow的个性化推荐功能