AfroLayout 0.2.0

AfroLayout 0.2.0

×

测试已测试✓
Lang语言 SwiftSwift
许可证 MIT
发布最近发布2017年2月
SwiftSwift版本3.0
SPM支持SPM✗

由Wilhelm Van Der Walt（Wilhelm Van Der Walt）、Martin Nygren（Martin Nygren）维护。

AfroLayout 0.2.0

  • 作者
  • Wilhelm

AfroLayout

AfroLayout为何而建

AfroLayout是一个Swift库，它将自动化带回AutoLayout。

  1. 起源
  2. 要求
  3. 集成
  4. 使用

起源

对于具有简单UI和UX的简单项目，故事板是完美的。它们可以快速组合并允许快速反馈设计更改。它还允许您通过使用IBOutlets和IBActions对故事板上的元素进行定制。然而，随着项目的发展，UI变得更加复杂，您的故事板可能会引入不良实践，例如根据某些状态显示和隐藏元素。它们也可能具有误导性，因为明显查看故事板并不能说明视图可以具有的不同状态，因此会给一个特定的状态带来重点并使得其他状态难以更改。

所以，如果您将视图布局代码移入源文件，最终会得到这样的方法（在某些情况下还有很多更糟糕的例子）😬) Screenshot of update constraints method

棺材的最后一颗钉子是，如果您需要动画。要进行动画需要保持适当的约束的引用，并完成UIView.animationwithduration的舞蹈，同时记得所有注意事项。使用Autolayout的所有优点突然开始感觉不值一提。

这就是AfroLayout的用武之地。这个库减少了您在代码中维护约束所需的工作量，它还让您可以利用Autolayout引擎的力量和frame动画的劳动来对视图进行动画。

要求

  • iOS 7.0
  • Xcode 7

集成

手动（iOS 7以上，OS X 10.9以上）

要在项目中手动使用此库，可以进行如下操作

  1. 对于项目，只需将AfroLayout.swift拖放到项目树中

使用说明

日常约束

AfroLayout有一个基础方法，可以轻松地为视图添加约束。该方法已被进一步抽象为辅助方法，为常用约束提供默认值。如果您对任何这些方法不满意，您始终可以回退到自定义约束方法。

在下面所有的方法中，请注意对UILayoutSupport的支持。

约束到视图的顶部

查看截图

    self.wrapperView.constrainToTopOfView(viewController.view, topLayoutGuide: viewController.topLayoutGuide)
    view1.constrainToTopOfView(self.wrapperView)
约束到视图的左上角

查看截图

    self.wrapperView.constrainToTopLeftOfView(viewController.view, topLayoutGuide: viewController.topLayoutGuide)
    view1.constrainToTopLeftOfView(self.wrapperView)
约束到视图的右上角

查看截图

    self.wrapperView.constrainToTopRightOfView(viewController.view, topLayoutGuide: viewController.topLayoutGuide)
    view1.constrainToTopRightOfView(self.wrapperView)
约束到视图的底部

查看截图

    self.wrapperView.constrainToBottomOfView(viewController.view, bottomLayoutGuide: viewController.bottomLayoutGuide)
    view1.constrainToBottomOfView(self.wrapperView)
约束到视图的左下角

查看截图

    self.wrapperView.constrainToBottomLeftOfView(viewController.view, bottomLayoutGuide: viewController.bottomLayoutGuide)
    view1.constrainToBottomLeftOfView(self.wrapperView)
约束到视图的右下角

查看截图

    self.wrapperView.constrainToBottomRightOfView(viewController.view, bottomLayoutGuide: viewController.bottomLayoutGuide)
    view1.constrainToBottomRightOfView(self.wrapperView)
约束在视图后

查看截图

    view1.constrainAfterView(self.wrapperView, inView: self.view)
    view2.constrainAfterView(self.wrapperView, inView: self.view, allign: .CenterY, horizontalPadding: 32)
    view3.constrainAfterView(self.wrapperView, inView: self.view, allign: .Bottom)
约束在视图前

查看截图

    view1.constrainBeforeView(self.wrapperView, inView: self.view)
    view2.constrainBeforeView(self.wrapperView, inView: self.view, allign: .CenterY, horizontalPadding: -32)
    view3.constrainBeforeView(self.wrapperView, inView: self.view, allign: .Bottom)
约束在视图下方

查看截图

    view1.constrainBelowView(self.wrapperView, inView: self.view)
    view2.constrainBelowView(self.wrapperView, inView: self.view, allign: .CenterX, verticalPadding: 32)
    view3.constrainBelowView(self.wrapperView, inView: self.view, allign: .Trailing)
约束在视图上方

查看截图

    view1.constrainOnTopOfView(self.wrapperView, inView: self.view)
    view2.constrainOnTopOfView(self.wrapperView, inView: self.view, allign: .CenterX, verticalPadding: -32)
    view3.constrainOnTopOfView(self.wrapperView, inView: self.view, allign: .Trailing)
添加底部约束

这通常在你正以scrollView布局视图时使用，你只需要快速添加底部约束到scrollView，以便scrollView知道如何调整其内容视图的大小。

    view1.addBottomConstraint(self.scrollView)

AfroLayout的基础

AfroLayout的大部分都围绕以下方法构建

    public func addCustomConstraints(
        inView superView: UIView,
        toViews views: [UIView]? = nil,
        selfAttributes: [NSLayoutAttribute],
        relations: [NSLayoutRelation]? = nil,
        otherViewAttributes: [NSLayoutAttribute]? = nil,
        multipliers: [CGFloat]? = nil,
        padding: [CGFloat]? = nil,
        priorities: [UILayoutPriority]? = nil)
            -> [NSLayoutConstraint] {
            //... 
        }

此方法允许您将以下内容转换为

    self.wrapperView.addConstraints([
            NSLayoutConstraint(
            item: view1, 
            attribute: NSLayoutAttribute.Top, 
            relatedBy: NSLayoutRelation.Equal, 
            toItem: self.wrapperView, 
            attribute: NSLayoutAttribute.Top, 
            multiplier: 1.0, 
            constant: 0.0),

            NSLayoutConstraint(
            item: view1, 
            attribute: NSLayoutAttribute.Leading, 
            relatedBy: NSLayoutRelation.Equal, 
            toItem: self.wrapperView, 
            attribute: NSLayoutAttribute.Leading, 
            multiplier: 1.0, 
            constant: 0.0),

            NSLayoutConstraint(
            item: view1, 
            attribute: NSLayoutAttribute.Trailing, 
            relatedBy: NSLayoutRelation.Equal, 
            toItem: self.wrapperView, 
            attribute: NSLayoutAttribute.Trailing, 
            multiplier: 1.0, 
            constant: 0.0),

            NSLayoutConstraint(item: view1, 
            attribute: NSLayoutAttribute.Bottom, 
            relatedBy: NSLayoutRelation.Equal, 
            toItem: self.wrapperView, 
            attribute: NSLayoutAttribute.Bottom, 
            multiplier: 1.0, 
            constant: 0.0)
            ])

转换为

        view1.addCustomConstraints(inView: self.wrapperView1, selfAttributes: [.Top, .Leading, .Trailing, .Bottom])

这是因为已经应用了适当的默认值来填充大多数相同的值，这是可能的。例如，NSLayoutConstraint 中的乘数通常为 1.0。你通常将视图的顶部约束到另一个视图的顶部，或者将某个东西约束到其父视图。然而，有多种方法可以添加约束，这种方法为您提供按照需要尽可能具体的工具，同时仍然可以通过查看一个方法来理解您约束的意义。例如，

    self.wrapperView3.addCustomConstraints(inView: self.view,
            toViews: [self.wrapperView2, self.wrapperView1, self.wrapperView2],
            selfAttributes: [.Top, .Leading, .Trailing],
            otherViewAttributes: [.Bottom, .Leading, .Trailing],
            relations: [.GreaterThanOrEqual, .Equal, .LessThanOrEqual],
            padding: [8.0, 0.0, 0.0],
            priorities: [750.0, 800.0, 500.0])

UILayoutSupport 支持

注意事项

作者

Wilhelm，[email protected]

许可证

AfroLayout 在 MIT 许可证下可用。有关更多信息，请参阅 LICENSE 文件。