第三方布局框架Neon初探
github地址:https://github.com/mamaral/Neon
居中
设置 view 在 superview 的中心,调用 anchorInCenter()并设置view大小,相当于frame center
view1.anchorInCenter(width: 300, height: 300)
imgV.anchorInCenter(width: 150, height: 150)
# 填充
如果想 view 填充superview,设置距离superview的边框距离, 调用 fillSuperview()
```
imgV.fillSuperview()
imgV.fillSuperview(left: 20, right: 5, top: 30, bottom: 5)
```

# 角对齐
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)
```

# 边对齐
如果想让 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)
```

# 边填充
如果想让 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)
```

# 相对对齐
##### 距离相对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)
```

##### 距离相对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)
```

##### 距离相对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)
```

# 挤压对齐
如果两个 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)
# 组合
多个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)
```

##### 角对齐组合 相对于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)

<br/>
##### 边对齐组合,相对于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)


第三方布局框架Neon初探的更多相关文章
- [Swift通天遁地]六、智能布局-(8)布局框架的使用:多分辨率适配和横竖屏布局
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- iOS常用第三方开源框架和优秀开发者博客等
博客收藏iOS开发过程好的开源框架.开源项目.Xcode工具插件.Mac软件.文章等,会不断更新维护,希望对你们有帮助.如果有推荐或者建议,请到此处提交推荐或者联系我. 该文档已提交GitHub,点击 ...
- Masonry 轻量级布局框架的使用
iOS 提供了自动布局的方法,但是原生的方法使用太过麻烦 ,Masonry 框架提供了类似的方法,同样可以实现自动布局 ,代码更加直观,而且容易理解. Masonry 是一个轻量级的布局框架.拥有自己 ...
- Android的SwipeToDismiss第三方开源框架模拟QQ对话列表侧滑删除,置顶,将头像图片圆形化处理。
<Android SwipeToDismiss:左右滑动删除ListView条目Item> Android的SwipeToDismiss是github上一个第三方开源框架(github ...
- 第三方开源框架的下拉刷新列表(QQ比较常用的)。
PullToRefreshListView是第三方开源框架下拉刷新列表,比较流行的QQ 微信等上面都在用. 下载地址(此开源框架于2013年后不再更新) 点此下载 package com.lixu.k ...
- iOS基础 - 第三方网络框架
一.iOS网络层次结构 基于iOS提供API实现上传文件和断点续传的思路 常用iOS第三方网路框架简介 AFNetworking(AFN) ASIHTTPRequest(ASI) 另外一个常用框架 S ...
- Masonry布局框架的使用
Masonry是一个轻量级的布局框架 拥有自己的描述语法 采用更优雅的链式语法封装自动布局 简洁明了 并具有高可读性.比我们使用自动布局,繁琐的约束条件,好用多了.下面我们来学学masonry的使用方 ...
- IOS控件布局之Masonry布局框架
前言: 回想起2013年做iOS开发的时候,那时候并没有采用手写布局代码的方式,而是采用xib文件来编写,如果使用纯代码方式是基于window的size(320,480)计算出一个相对位置进行布局,那 ...
- iOS下的界面布局利器-MyLayout布局框架
Swift:TangramKit: https://github.com/youngsoft/TangramKit OC:MyLayout: https://github.com/youngsof ...
随机推荐
- jqGrid整合篇
jqgrid实现多级表头 //使用setGroupHeaders参数: $( "#datagrid" ).jqGrid( 'setGroupHeaders' , { useColS ...
- iTOP-4418开发板支持Android4.4/5.1.1系统、Linux3.4.39、QT2.2/4.7/5.7、Ubuntu12.04
核心板参数 尺寸:50mm*60mm 高度:核心板连接器组合高度1.5mm PCB层数:6层PCB沉金设计 4418 CPU:ARM Cortex-A9 四核 S5P4418处理器 1.4GHz 68 ...
- app每次更新版本时调用js代码提示用户下载更新
var url = '网络地址'; //APP升级 var wait; function update(){ //判断操作系统 var system = 'android'; if(mui.os.io ...
- Linux环境安装jdk12-rpm
此博客只是本人的个人学习记录,若有什么误导观看者,请不要怪我... 1.环境准备: Linux环境:Centos7 jdk版本:JavaSE12 下载地址:https://www.oracl ...
- mysql定时器设置开机默认自启动
1).查询mysql安装位置:show variables like "%char%"; 2).查询定时器是否开启: -查询定时器状态:show VARIABLES LIKE '% ...
- raw_input与input
raw_input 不管用户输入的是什么,最后打印的类型都会是str字符串类型 input 会根据用户的输入变换成相应的类型,但是需要注意的是我们用户在输入字符或者字符串的时候,需要给他们加上双引号, ...
- The SetStack Computer UVA - 12096
题意:初始状态的栈内包含一个空集,对栈进行一下操作: PUSH:向栈内压入一个空集 DUP:复制栈顶,并压入栈内 UNION:将栈顶端两个集合出栈,并将两个元素的并集入栈 INTERSECT:将栈顶端 ...
- 清北学堂学习总结day3
小学知识总结 上午篇 •积性函数的卷积公式 (1)(f * g)( n ) = ∑(d|n) f( d ) x g ( n / d ) (2)代码实现 LL f[N], g[N], h[N]; voi ...
- Vue中ajax返回的结果赋值
这是第二次在项目中遇到此问题,ajax请求成功后在success函数中为Vue实例data里的变量赋值,却失败了 new Vue({ el:'#app', data:{ msg:'' }, creat ...
- 试题 E: 迷宫
[问题描述]下图给出了一个迷宫的平面图,其中标记为 1 的为障碍,标记为 0 的为可以通行的地方.010000000100001001110000迷宫的入口为左上角,出口为右下角,在迷宫中,只能从一个 ...