github地址:https://github.com/mamaral/Neon
居中
设置 view 在 superview 的中心,调用 anchorInCenter()并设置view大小,相当于frame center
view1.anchorInCenter(width: 300, height: 300)
imgV.anchorInCenter(width: 150, height: 150)
![](https://img.haomeiwen.com/i7787328/031e083b031a51f6.png)
填充
如果想 view 填充superview,设置距离superview的边框距离, 调用 fillSuperview()
imgV.fillSuperview()
imgV.fillSuperview(left: 20, right: 5, top: 30, bottom: 5)
![](https://img.haomeiwen.com/i7787328/8ac56cccd11053be.png)
角对齐
view 相对于 superview 固定于某个角,调用anchorInCorner(),并传入要对齐哪个角的参数
view1.anchorInCorner(.topLeft, xPad: 20, yPad: 100, width: 100, height: 100)
view2.anchorInCorner(.topRight, xPad: 20, yPad: 50, width: 100, height: 100)
view3.anchorInCorner(.bottomLeft, xPad: 20, yPad: 20, width: 100, height: 100)
view4.anchorInCorner(.bottomRight, xPad: 20, yPad: 30, width: 100, height: 100)
![](https://img.haomeiwen.com/i7787328/7c0e7991174be47d.png)
边对齐
如果想让 view 相对于 superview 的某一边依靠对齐,调用anchorToEdge,自动居中对齐
view1.anchorToEdge(.top, padding: 300, width: 100, height: 100)
view2.anchorToEdge(.left, padding: 0, width: 100, height: 100)
view3.anchorToEdge(.bottom, padding: 88, width: 100, height: 100)
view4.anchorToEdge(.right, padding: 0, width: 100, height: 100)
![](https://img.haomeiwen.com/i7787328/a182f5bd1905126b.png)
边填充
如果想让 view 相对于 superview 的某一边居中对齐并自动填拉伸充,调用anchorAndFillEdge()
view1.anchorAndFillEdge(.top, xPad: size + 5, yPad: 88, otherSize: size)
view2.anchorAndFillEdge(.bottom, xPad: size + 5, yPad: 83, otherSize: size)
view3.anchorAndFillEdge(.left, xPad: 0, yPad: 0, otherSize: size)
view4.anchorAndFillEdge(.right, xPad: 0, yPad: 0, otherSize: size)
![](https://img.haomeiwen.com/i7787328/0777f3fbb5622247.png)
相对对齐
距离相对view右边 居 上-中-下
view1.anchorInCenter(width: 200, height: 200)
view2.align(.toTheRightMatchingTop, relativeTo: view1, padding: 5, width: 50, height: 50)
view3.align(.toTheRightMatchingBottom, relativeTo: view1, padding: 5, width: 50, height: 50)
view4.align(.toTheRightCentered, relativeTo: view1, padding: 5, width: 50, height: 50)
![](https://img.haomeiwen.com/i7787328/a1cbb1692946a3cd.png)
距离相对view左边 居 上 中 下
view2.align(.toTheLeftMatchingTop, relativeTo: view1, padding: 5, width: 50, height: 50)
view3.align(.toTheLeftMatchingBottom, relativeTo: view1, padding: 5, width: 50, height: 50)
view4.align(.toTheLeftCentered, relativeTo: view1, padding: 5, width: 50, height: 50)
![](https://img.haomeiwen.com/i7787328/cef670c1d98302a4.png)
距离相对view下边 居 上 中 下
view2.align(.underMatchingLeft, relativeTo: view1, padding: 5, width: 50, height: 50)
view3.align(.underMatchingRight, relativeTo: view1, padding: 5, width: 50, height: 50)
view4.align(.underCentered, relativeTo: view1, padding: 5, width: 50, height: 50)
距离相对view上边 居 上 中 下
view2.align(.aboveMatchingLeft, relativeTo: view1, padding: 5, width: 50, height: 50)
view3.align(.aboveMatchingRight, relativeTo: view1, padding: 5, width: 50, height: 50)
view4.align(.aboveCentered, relativeTo: view1, padding: 5, width: 50, height: 50)
对齐并填充
不知道或者没法指定一个相对视图的大小,但又要兼顾填充和对齐,并且还依赖与相邻的 view。调用alignAndFill()、alignAndFillWidth()、alignAndFillHeight()
view1.anchorInCenter(width: 200, height: 200)
view2.alignAndFillWidth(align: .toTheRightMatchingTop, relativeTo: view1, padding: 5, height: 30)
view3.alignAndFillHeight(align: .aboveCentered, relativeTo: view1, padding: 50, width: 60)
view4.alignAndFill(align: .toTheLeftMatchingTop, relativeTo: view1, padding: 5)
![](https://img.haomeiwen.com/i7787328/c02c64834dd276a9.png)
挤压对齐
如果两个 view 夹着中间一个 view 的需求,调用alignBetweenHorizontal()和alignBetweenVertical()
view1.anchorInCenter(width: 150, height: 300)
view2.align(.toTheRightMatchingTop, relativeTo: view1, padding: 5, width: 100, height: 100)
view3.align(.toTheRightMatchingBottom, relativeTo: view1, padding: 5, width: 100, height: 100)
view4.align(.toTheRightCentered, relativeTo: view1, padding: 5, width: 100, height: 100)
view4.alignBetweenVertical(align: .aboveMatchingRight, primaryView: view3, secondaryView: view2, padding: 10, width: 50)
![](https://img.haomeiwen.com/i7787328/95f45e0f6d1aa0ab.png)
组合
多个view一起组合布局,调用groupInCenter()、groupInCorner()、groupAgainstEdge()
居中对齐组合
view.groupInCenter(group: .vertical, views: [view1,view2,view3], padding: 10, width: size, height: size)
view.groupInCenter(group: .horizontal, views: [view1,view2,view3], padding: 20, width: size, height: size)
![](https://img.haomeiwen.com/i7787328/e30dccfafbb60d42.png)
角对齐组合 相对于superview某一个角组合排布
view.groupInCorner(group: .horizontal, views: [view1, view2, view3], inCorner: .bottomLeft, padding: 10, width: size, height: size)
view.groupInCorner(group: .vertical, views: [view1, view2, view3], inCorner: .bottomRight, padding: 10, width: size, height: size)
![](https://img.haomeiwen.com/i7787328/02cdb30aa15e04c9.png)
边对齐组合,相对于superview某一条边的中点排布
view.groupAgainstEdge(group: .horizontal, views: [view1, view2, view3], againstEdge: .left, padding: 10, width: size, height: size)
view.groupAgainstEdge(group: .vertical, views: [view1, view2, view3], againstEdge: .bottom, padding: 10, width: size, height: size)
![](https://img.haomeiwen.com/i7787328/c60dde25111f0881.png)
最后,我想说
![](https://img.haomeiwen.com/i7787328/596241b81f97af1f.jpg)
网友评论