QuickLayout 3.0.2

QuickLayout 3.0.2

×

由 Daniel huri 维护。

QuickLayout 3.0.2

  • 由
  • Daniel Huri

QuickLayout

Platform Language Version Carthage Compatible SwiftPM Compatible Accio: Supported codecov License

image

QuickLayout 提供了一个额外的简单方法来使用代码管理 Auto Layout。您可以使用 QuickLayout 来通过编程方式对界面进行对齐，甚至不需要显式创建约束。

为什么

为什么您应该使用 QuickLayout？

  • QuickLayout 可以大大减少在需要编写视图层次结构时的代码量。
  • 它为 iOS、tvOS 和 macOS 提供了公共的 Auto Layout API。
  • QuickLayout 包含了 iOS 应用大多数所需的 Auto Layout 构造。
  • QuickLayout 方法的声明非常详细且清晰。它完全有文档支持！
  • 使用实例本身来布局 UIView 或 NSView 或视图数组，甚至不需要创建一个单独的 NSLayoutConstraint 实例。

命名约定

自 2.0.0 版本起，QuickLayout 支持tvOS 和 macOS，以及 iOS。因此，进行了一些调整。

  • QLView 替换了 UIView 或 NSView。
  • QLPriority 替换了 NSLayoutConstraint.Priority 和 UILayoutPriority
  • QLAttribute 替换了 NSLayoutConstraint.Attribute 和 NSLayoutAttribute
  • QLRelation 替换了 NSLayoutConstraint.Relation 和 NSLayoutRelation

功能

  • 对 QLView 的扩展，允许您直接从视图本身设置约束。
  • 对 QLView 数组 的扩展，允许您直接从视图数组设置约束。

示例项目

该示例项目演示了使用 QuickLayout 在几个常见用例中的优势。看看吧！😎

要求

Swift 4.0 或更高版本。

安装

CocoaPods

CocoaPods 是 Cocoa 项目的依赖管理工具。您可以使用以下命令安装它

$ gem install cocoapods

要使用 CocoaPods 将 QuickLayout 集成到您的 Xcode 项目中，在您的 Podfile 中指定以下内容

pod 'QuickLayout', '3.0.2'

然后，运行以下命令

$ pod install

Carthage

Carthage是一个去中心化的依赖管理工具，会构建你的依赖并提供二进制框架。

您可以使用以下命令通过 Homebrew 安装Carthage：

$ brew update
$ brew install carthage

要使用Carthage将QuickLayout集成到您的Xcode项目中，请在您的 Cartfile 中指定以下内容：

github "huri000/QuickLayout" == 3.0.2

Swift Package Manager

Swift Package Manager 是一个用于管理Swift代码分布的工具。它与Swift构建系统集成，自动完成下载、编译和链接依赖的过程。

使用Xcode 11.0及更高版本，进入您的项目文件，输入此仓库的项目URL。

https://github.com/huri000/QuickLayout

Accio

Accio 是由SwiftPM驱动的去中心化的依赖管理工具，适用于iOS/tvOS/watchOS/macOS项目。

您可以使用以下命令通过 Homebrew 安装Accio：

$ brew tap JamitLabs/Accio https://github.com/JamitLabs/Accio.git
$ brew install accio

要使用Accio将QuickLayout集成到您的Xcode项目中，请在您的 Package.swift 清单中指定以下内容：

.package(url: "https://github.com/huri000/QuickLayout.git", .exact("3.0.2"))

将 "QuickLayout" 指定为目标依赖之后，运行 accio install。

手动方式

将 源文件 添加到您的项目中。

使用方法

使用QuickLayout非常简单。不需要设置或准备。所有必要的函数都在任何QLView实例中可用，并且已经全面文档化和高度描述。

首先，一些模板代码：定义类型为QLView的simpleView并将其添加到视图层次结构中。

// Create a view, add it to view hierarchy, and customize it
let simpleView = QLView()
simpleView.backgroundColor = .gray
parentView.addSubview(simpleView)

常数边

设置视图的常数边

simpleView.set(.height, of: 50)

您可以使用可变参数设置多个常数边

simpleView.set(.width, .height, of: 100)

对父视图进行布局

只要父视图存在，您就可以轻松将视图直接对其布局。

布局边-x到父视图边-x

将视图的顶部布局到其父视图的顶部

simpleView.layoutToSuperview(.top)

将视图的居中X布局到其父视图的居中X

simpleView.layoutToSuperview(.centerX)

多边处理

您也可以类似地使用可变参数来布局多条边。

simpleView.layoutToSuperview(.top, .bottom, .centerX, .width)

使用应用约束

所有布局方法都返回应用约束，但返回的值是可丢弃的，因此如果您不需要它们，可以简单地忽略它们。

let topConstraint = simpleView.layoutToSuperview(.top)
// Change the offset value by adding 10pts to it
topConstraint.constant += 10

比例

您可以将视图布局为其父视图宽度的80%

simpleView.layoutToSuperview(.width, ratio: 0.8)

偏移量

可以将视图布局为其父视图宽度减去10pts的偏移量

simpleView.layoutToSuperview(.width, offset: -10)

居中

将视图布局在父视图的中心

let center = simpleView.centerInSuperview()

您可以选择检索返回的 QLCenterConstraints 实例。

center?.y.constant = 20

这就相当于执行以下操作，但不获取 QLCenterConstraints 实例（而是获取一个 NSLayoutConstraint 数组）。

simpleView.layoutToSuperview(.centerX, .centerY)

大小

大小为父视图的尺寸，可选比例为-意味着 simpleView 是其父视图尺寸的80%

let size = simpleView.sizeToSuperview(withRatio: 0.8)

您可以选择检索返回的 QLSizeConstraints 实例。

size?.width.constant = -20

这就相当于执行以下操作，但不获取 QLSizeConstraints 实例（而是获取一个 NSLayoutConstraint 数组）。

simpleView.layoutToSuperview(.width, .height, ratio: 0.8)

填充

let fillConstraints = simpleView.fillSuperview()

您可以选择检索返回的 QLFillConstraints 实例。

fillConstraints?.center.y.constant = 5

轴

您可以将视图布局到某个轴上，例如：

水平布局

let axis = simpleView.layoutToSuperview(axis: .horizontally)

垂直布局

simpleView.layoutToSuperview(axis: .vertically)

这相当于（水平布局）

simpleView.layoutToSuperview(.left, .right)

或（垂直布局）

simpleView.layoutToSuperview(.top, .bottom)

您还可以检索QLAxisConstraints实例并将其使用。

布局到视图

在视图层级内部，可能将一个视图布局到另一个视图内。

布局视图的边缘-x 到另一个视图的边缘-y

您可以布局视图的边缘到另一个视图上。例如

将simpleView的left边缘布局到anotherView的right边缘上，右偏移20pts。

simpleView.layout(.left, to: .right, of: anotherView, offset: 20)

边缘-x 到另一个视图的边缘-x

将simpleView的top边缘布局到anotherView的top边缘

simpleView.layout(to: .top, of: anotherView)

多重边缘

将simpleView的左、右和centerY边缘与anotherView的左、右和centerY边缘分别对齐。

simpleView.layout(.left, .right, .centerY, to: anotherView)

内容环绕

内容的粘附优先级和内容压缩阻力也可以在代码中修改

垂直示例

let label = UILabel()
label.text = "Hi There!"
label.verticalCompressionResistancePriority = .required
label.verticalHuggingPriority = .required

您可以一起设置压缩阻力和粘附优先级，从而强制其在垂直和水平方向上都为.required。

label.forceContentWrap()

您可以强制内容绕特定轴换行

label.forceContentWrap(.vertically)

QLView元素数组

您可以一次性生成多个视图并对它们应用约束。

// Create array of views and customize it
var viewsArray: [QLView] = []
for _ in 0...4 {
    let simpleView = QLView()
    view.addSubview(simpleView)
    viewsArray.append(simpleView)
}

常数边

每个元素的高度设置为50pt，使用这一行代码即可。

viewsArray.set(.height, of: 50)

轴

每个元素都粘附在父视图的左侧和右侧。

viewsArray.layoutToSuperview(axis: .horizontally, offset: 30)

多边边框

每个元素的左侧、右侧、顶部和底部边框都与另一个视图完全贴合。

viewsArray.layout(.left, .right, .top, .bottom, to: parentView)

分布视图

您可以垂直分布元素（一个接一个），第一个元素扩展到父视图的顶部，而最后一个元素扩展到父视图的底部。每个元素之间有1pt的偏移。

viewsArray.spread(.vertically, stretchEdgesToSuperview: true, offset: 1)

更多

每个布局方法都有几个可选参数 - 见下文

优先级

  • 应用的约束优先级。
  • 被所有的布局方法包含。
  • 默认值：.required。

除了默认的系统优先级外，QuickLayout 还提供了一个 - 它有 999 的值，称为 .must。

您可以随意调整优先级以处理断开和冗余。

设置约束优先级的示例

let width = simpleView.set(.width, of: 100, priority: .must)

关系

  • 视图与另一个视图的关系。
  • 被大多数布局方法包含。
  • 默认值：.equal

比例

  • 视图与另一个视图的比例。
  • 被大多数布局方法包含。
  • 默认值：1

偏移

  • 视图相对于另一个视图的偏移。
  • 被大多数布局方法包含。
  • 默认值：0

显式布局

您可以根据需要将视图/s显式地布局到父视图或另一个视图。大多数参数都有默认值。

simpleView.layout(.height, to: .width, of: anotherView, relation: .lessThanOrEqual, ratio: 0.5, offset: 10, priority: .defaultHigh)

贡献

欢迎提交分支、补丁和其他反馈。

作者

Daniel Huri ([email protected])

许可协议

QuickLayout遵循MIT许可协议。有关更多信息，请参阅LICENSE文件。