FormationLayout 0.8.5

FormationLayout 0.8.5

×

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

由 Evan Liu 维护。

FormationLayout 0.8.5

  • 由
  • Evan Liu

FormationLayout

banner

文档

FormationLayout 是一个根视图的最顶层布局类。

  • FormationLayout 采用一个 UIView 作为其 rootView。
  • rootView 的 默认不设置为 false，但可以在构造函数中设置。
  • 子视图的 将自动设置为 false。
  • 没有 superView 的子视图将自动添加到 rootView。
demo { canvas, icon in
    FormationLayout(rootView: canvas)[icon].center(equalTo: canvas)
}

FormationLayout

锚点

视图锚点：left、right、top、bottom、leading、trailing、width、height、centerX、centerY、lastBaseline、firstBaseline、centerXWithinMargins、centerYWithinMargins

  • layout[view].anchor(equalTo: view2, multiplyBy: multiplier, plus: constant)
    • view.anchor == view2.anchor * multiplier + constant

  • layout[view].anchor(equalTo: anchor2, of: view2, multiplyBy: multiplier, minus: constant)
    • view.anchor == view2.anchor2 * multiplier - constant

  • layout[view].anchor(greaterThanOrEqualTo: view2)
    • view.anchor >= view2.anchor

  • layout[view].anchor(lessThanOrEqualTo: value) (仅宽度和高)
    • view.anchor <= value

demo { canvas, icon1, icon2, icon3 in
    let layout = FormationLayout(rootView: canvas)
    layout[icon1].top(equalTo: canvas, plus: 10).leading(equalTo: canvas, plus: 20)
    layout[icon2].top(equalTo: icon1).leading(equalTo: .trailing, of: icon1, plus: 10)
    layout[icon3].bottom(equalTo: canvas, minus: 10).leading(equalTo: icon1, multiplyBy: 2)
}

Anchors

辅助器

  • aspectRatio: width:height
  • size: width & height
  • center: centerX & centerY
demo { canvas, icon1, icon2, icon3 in
    let layout = FormationLayout(rootView: canvas)
    layout[icon1].aspectRatio(equalTo: 1.5).width(equalTo: 30)
    layout[icon2].size(equalTo: 30).center(equalTo: canvas, multiplyBy: 0.8)
    layout[icon3].size(equalTo: icon2, minus: 10).center(equalTo: icon2, plus: 30)
}

Helpers

固定

layout[view].pin(to: canvas) 将设置

  • view.top == canvas.top
  • view.bottom == canvas.bottom
  • view.left == canvas.left
  • view.right == canvas.right

layout[view].pin(to: canvas, margin: 10) 将设置

  • view.top == canvas.top + 10
  • view.bottom == canvas.bottom - 10
  • view.left == canvas.left + 10
  • view.right == canvas.right - 10
demo { canvas, icon1, icon2, icon3 in
    let layout = FormationLayout(rootView: canvas)
    layout[icon1].pin(to: canvas, edgesWithMargin: [.top: 10, .leading: 3])
    layout[icon2].pin(to: canvas, margin: 30)
    layout[icon3].pin(to: canvas, edges: [.topBottom, .trailing], margin: 3)
}

Pin

并列

  • layout[logo].below(topLayoutGuide, gap: 10)
    • logo.top == topLayoutGuide.bottom + 10

  • layout[copyright].above(bottomLayoutGuide, gap: 10)
    • copyright.bottom == bottomLayoutGuide.top - 10

demo { canvas, icon1, icon2, icon3 in
    let layout = FormationLayout(rootView: canvas)
    layout[icon1].center(equalTo: canvas)
    layout[icon2].before(icon1).above(icon1, gap: 5)
    layout[icon3].after(icon1).below(icon1, gap: 5)
}

Abreast

分组

layout.group(view1, view2) 会为

  • layout[view1]
  • layout[view2]
demo { canvas, icon1, icon2, icon3 in
    let layout = FormationLayout(rootView: canvas)
    layout.group(icon1, icon2, icon3).centerY(equalTo: canvas)
    layout[icon1].leading(equalTo: canvas, plus: 5)
    layout[icon2].centerX(equalTo: canvas)
    layout[icon3].trailing(equalTo: canvas, minus: 5)
}

Group

条件

layout.when() 为一个条件创建约束，而 not 则为其否则部分创建约束。

demo { canvas, icon in
    var isLoggedIn = true 

    let layout = FormationLayout(rootView: canvas)
    let loggedInLayout = layout.when { isLoggedIn }

    layout[icon].centerX(equalTo: canvas)
    loggedInLayout[icon].top(equalTo: canvas, plus: 10)
    loggedInLayout.not[icon].bottom(equalTo: canvas, minus: 10)

    layout.update()
}

Condition

isLoggedIn = false

ConditionNot

优先级

所有约束默认具有 优先级。

demo { canvas, icon in
    let layout = FormationLayout(rootView: canvas)
    layout[icon].centerX(equalTo: canvas).size(equalTo: 20)
        .centerY(equalTo: canvas, at: UILayoutPriorityDefaultLow) // Try UILayoutPriorityRequired
        .bottom(equalTo: canvas, at: UILayoutPriorityDefaultHigh)
}

PriorityLow

UILayoutPriorityRequired

PriorityRequired

游乐场

  • 打开 Documentation/Doc.xcworkspace。
  • 构建 FormationLayout-iOS 构建方案（⌘+B）。
  • 在 项目导航器 中打开 Doc 游乐场。
  • 点击每行 demo 最右侧的“展示结果”按钮。

安装