Skip to content

DingSoung/FlexLayout

Repository files navigation

Release Status

SwiftPackage

Language

Donate

一个 Swift 版本的 Flexbox Layout 工具

安装

Swift Package Manager

https://github.com/DingSoung/FlexLayout master

使用

构造树

let layout1 = FlexLayout()
layout1....
let layout2 = FlexLayout()
layout1....
let layout3 = FlexLayout()
layout1.set(children: [layout2, layout3])

计算

_ = layout1.calculateLayout()
print(layout1.frame, layout2.frame, layout3.frame)

赋值方式

方式 1: 直接赋值

  • 数值,枚举,结构
let layout = FlexLayout()
layout.width = .Value(value: 80, unit: .percent)
layout.height = 300
layout.alignItems = .flexStart
  • 支持字符串复制
let layout = FlexLayout()
layout.height = "300"
layout.alignItems = "flex-start"
layout.width = "80%"
  • 支持百分数
let layout = FlexLayout()
layout.width = 80%

方式 2: 动态赋值

  • CSS 字典
let layout = FlexLayout()
layout.set(layout: [
		"aspect-ratio": "1",
		"width": "50%",
		"margin": "8"
     ]
)
  • CSS 字符串
let layout = FlexLayout()
layout.set(layout: "aspect-ratio: 1; width: 50%; margin: 8")

方式 3: 链式调用

let layout = FlexLayout()
	.margin(8)
	.flexShrink(1)
	.width(100%)
	.height(.auto)

特征

#import FlexLayout
  • 使用简便
let view = UIVIew()
view.layout.width(100).height(200)

let label = UILabel()
label.width(80%).top(10)

view.addSubView(label)
view.layout.setChildren(label.layout)

_ = view.layout.calculateLayout()
view.recursiveSyncFrame()
  • 支持异步线程
DispatchQueue.global.async {
	let layout = FlexLayout()
  layout...
	 _ = layout.calculateLayout()
	 DispatchQueue.main.async {
	 		view.frame = layout.frame
	 }
}
  • 绝对控制
view.frame = ...

let layout = FlexLayout()
layout...
_ = layout.calculateLayout()
view.frame = layout.frame

layout.width = 100%
_ = layout.intrinsicSize
UIView.animation {
	view.frame = layout.frame
}