南京建设网站公司网站,贵阳建立网站,安徽网站建设优化推广,无限空间 网站看到群中好多朋友还停留在Frame布局的痛苦时代#xff0c;以及有些开发者接手别人的就项目发现布局一团乱。而且没有启动图的时候并不是真正真正适配iPhone 6(S)、iPhone6(S) Plus等设备 。寒哥准备尽可能详细的讲一讲我所掌握的AutoLayout 。AutoLayout很难#xff1f;我觉得… 看到群中好多朋友还停留在Frame布局的痛苦时代以及有些开发者接手别人的就项目发现布局一团乱。而且没有启动图的时候并不是真正真正适配iPhone 6(S)、iPhone6(S) Plus等设备 。寒哥准备尽可能详细的讲一讲我所掌握的AutoLayout 。AutoLayout很难我觉得AutoLayout的难的、约束的选择性太多抽象性增加大家直接看书或者看博客不太好理解但是有人教的话还是挺快的。所以我尽量用GIF的方式给大家展现。AutoLayout是什么 Autolayout是一种布局技术专门用来布局UI界面的。用来取代Frame布局在遇见屏幕尺寸多重多样的不足 Autolayout自iOS6开始引入由于Xcode4的不给力当时并没有得到很大的推广 在iOS7Xcode5开始Autolayout的开发效率得到很大的提升 苹果官方也推荐开发者尽量使用Autolayout来布局UI界面Autolayout能轻松的解决屏幕适配的问题AutoLayout从哪里入手? 自 从Xcode6之后你会看到我们新建一个Single Application会发现一个ViewController的View非常大跟任何一个iPhone/iPad的尺寸都不一样这些都是假象、假 象、假象。Apple 把尺寸抽象为了一个正方形到真正的设备上才是真正的布局。AutoLayoutIB中操作的属性介绍 我们会发现貌似这个玩意好多配置貌似很麻烦的样子。下面我们挨个讲解1.相对处理Pin 属性说明1:距离边缘 最上面的4个虚线表示某个View的距离上边、左边、右边、下边多高。2:那个蓝色的Constrain To Margins 是iPhone6出现之后。Apple 觉得更大的分辨率有点间距好看默认为8如果这个勾上了这个View距离四周的值就变成了你输入的值8。 一般建议勾掉 。lets Play我们开始Demo前先想想我们在Frame时代布局需要什么 1 2 3 4 { original{x,y} size:{width,height} } 在iOS中布局是绝对定位的大致这么理解吧。所以我们需要某个View的XYWH我们从基本的入门 我们无论添加多少约束都是需要定位好某个View的XYWH。 少了不行多了更不行。 少了不行多了更不行。 少了不行多了更不行。 重要的事情说三遍。这里先不讨论UIlabel、UITextView、UIImageView等自带的内建高度。 Demo 1.某个View距离父View上下左右间距全部为20。 请注意我这里把距离下面的也就是BottomLayoutGuide的约束改成了距离控制器的View为什么因为BottomLayoutGuide是晚于View加载的如果参考这个会造成进入页面会卡一下。尽量不要直接参考下面 TopLayoutGuide 则没事。加完约束你会发现貌似并没有什么效果不是的屏幕中出现的黄色的线条 这是IB在提升我们你所添加的约束 。和真实的尺寸不一样怎么修改继续图 属性说明34 固定某个View的宽高。 Demo 2.某个View距离在父View的左侧20上20宽高为100100。 注意我在添加约束的时候有个选项叫做updateFrame如果勾选会直接将Frame调整到真实值而不需要再次update 。这里我们只是讲了最简单定位单个View你会觉得和Frame并没有什么区别 。区别在于AutoLayout的核心是参照也就是基本上任何一个View都可以参照另一个View。 接下来讲解Pin里面第56个属性 equal、Width、equal、Height选中的多个View宽高相等。 Demo 3.某个View距离在父View的左侧20demo2中白色View上20宽高和Demo2中的宽高一样。 属性6.AspectRatio比例。假设某个View距离父View右上角20 20 宽高比 21 宽100。 第七个属性Align其实在第一个面板中已经有了放在下一部分讲解。是时候给讲解下约束是什么玩意了刚才你看到我对约束修改了。我们点击下某个约束。 AutoLayout的公式 1 2 3 第一个Item的属性 ( )第二个Item的属性*MultiplierConstant 第一个Item的属性 ( )第二个Item的属性*MultiplierConstant 第一个Item的属性 ( )第二个Item的属性*MultiplierConstant 比如图中的View 约束 可以理解为View的tralling右侧 等于eauql 1倍multpiler的控制的右侧 20constant 1 2 注意比例是支持表达式的 如 23 releation是支持great than lessthan 具体是多少 系统自动算出2. 对齐处理Align 介绍属性说明Leading Edges左对齐Trailing Edges右对齐Top Edges上对齐Bottom Edges下对齐Horizontal Centers水平中心对齐Vertical Centers竖向中心对齐Baselines基线对齐Horizontal Center in Container对齐容器中的水平中心Vertical Center in Container对齐容器中的竖向中心Demo 4.某个View距离在父View的右侧20demo3中白色View上20宽高和Demo3中的宽高一样并且有对齐。 Demo5.某个View 居中与父View 长宽50。 某些控件是有baseLine的如UILabel、UITextView看下不同吧。Demo6.某个label和另外一个label基线对。 3. UILabel内建高度自适应高度像label 默认是有宽度的宽度就是字体自适应的。这样我们就可以不给UIlabel高度把Label的NumberOfline 0就可以自适应高度了。Demo7.Label自适应高度 4. 小技巧1.有时候约束太多的时候我们可以给某个View起个假名字就能很方便的看到是哪个View了。2.View总是选不中按 ctrl shift 单击。 3.AutoLayout遇见ScrollView。参看这个文章《AutoLayout深入浅出三[相遇Scrollview]》如图 Demo 8.ScrollView过长无法编辑怎么办 将控制器改为Freedom修改ContentView的高度约束这样ScrollView就可以滚动了也可以往下编辑了。 5.AutoLayout遇见UItableViewCell AutoLayout深入浅出四[不仅是UIWebView与UITableView的纠缠] AutoLayout深入浅出五[UITableView动态高度] 动态计算UITableViewCell高度详解 以上4个为讲解 。 下面实践 https://github.com/forkingdog/UITableView-FDTemplateLayoutCell博客讲解 6.个人写的小技巧 《AutoLayout分分钟搞定等比例布局》 《友好的ContainerViewAutoLayout资料推荐》 7.iOS 9及AutoLayout的注意点当然也是我写的。AutoLayout好多好多不懂的终于明白了。总结在StoryBoard里面开发其实就是拿着ViewController当做View用如果你还是觉得复杂可以把View抽象出去。 转载于:https://www.cnblogs.com/Free-Thinker/p/5158461.html
