Visually

Visually 是一个轻量级的库，提供了一些自定义运算符，旨在帮助您以短小、表达性强的方式构建布局。

Visually 受 Apple 视觉格式的强烈影响，但它增加了类型安全性，去除了创建视图和度量字典的必要性。事实上，我的目标之一是使它对视觉格式用户尽可能熟悉，就像自定义运算符的限制所允许的那样。

限制

我想保持 Visually 轻量。其目的应该是创建尽可能简短、易于编写和阅读的自布局代码。我的目标并不是模仿 Apple 自动布局框架的所有功能，因此有一些类型的约束无法使用 Visually 创建，例如视图宽度和高度的关联或居中约束。对于这些，我倾向于使用 Apple 的锚点 API，它与 Visually 结合得很好。

Swift 的编译器和静态分析器在解析长的运算符链时往往会变慢，Visually 也不例外。尽管如此，我强烈建议不要创建 Visually 表达式的数组，然后将它们扁平化到约束数组中。相反，我倾向于创建空的约束数组，然后逐行使用 Visually 表达式在它上添加约束。

安装

Cocoapods

将 pod 'Visually' 添加到 Podfile 中并执行 pod install。详细信息请参阅 CocoaPods 网站

Carthage

将 github "lukkas/Visually" 添加到 Cartfile 中，运行 carthage update 并将构建的框架拖到您的 Xcode 项目中。详细信息请参阅 Carthage git 仓库

运算符和规则

Visually 定义了 15 个自定义运算符，并为 UIView/NSView 添加下标，以实现其目标。这些运算符可以分为 5 组

• 以 | 开头的 前缀运算符 - 创建对父视图左侧的约束
• 以 | 结尾的后缀运算符 - 创建对父视图右侧的约束
• 以 - 开头的 中缀运算符 - 创建兄弟视图之间的约束
• ~ 运算符 - 放置在约束常量值旁边可更改约束的优先级
• 前缀运算符 >= 和 <= - 用于子脚本中，将默认的 equal 关系更改为 greaterThanOrEqual 或 lessThanOrEqual

如前所述，子脚本创建宽度/高度约束

Visually 表达式，通过运算符、视图、常量和优先级的组合创建，总是包裹在两个函数之一中 - H(<expression>) 或 V(<expression>)。它们将那些表达式转换为 NSLayoutConstraint 对象数组，分别对应水平和垂直轴

例子表达式

• H(|-8-label->=8-|) - 左侧等于父视图 8，右侧大于或等于父视图 8
• V(label-(10 ~ .defaultHigh)-button[44]) - 标签底部与按钮顶部相距 10，优先级为默认高，按钮高度设置为 44
• V(button[>=44]->=-|) - 按钮高度大于或等于44，底部到父视图的距离大于或等于0
• V(|->=8-label) - 顶部到父视图的距离大于或等于8
• H(label->=10-view) - 视图的左侧锚点距离标签的右侧锚点不小于10
• H(|-view[50%]-button[50%]-) - 视图和按钮填满父视图，两者都占用宽度的一半
• H(|-view-|, options: .toSafeArea) - 视图填满父视图的安全区域

实例用法

import Visually

class MyView: UIView {
    let view: UIView
    let label: UILabel
    let button: UIButton

    func addConstraints() {
        var c = [NSLayoutConstraint]()
        c += H(|-view-label->=8-|)
        c += V(|-20-view-8-button[44]-20-|)
        NSLayoutConstraint.activate(c)
    }
}