三大部分:

   一: AutoLayout的来源和原理

   二:StoryBoard

   三:Code To AutoLayout


 一:AutoLayout简介

         AutoLayout 是一个描述各种约束的行为,比如,一个View 距离父View上边距多少,相邻之间的间隔,各个View之间的宽高关系等等


二:StoryBoard

           第一部分:1.什么是约束以及约束的属性
                               2.IB元素的约束列表
                               3.IB中添加约束的方式
                               4.优先级  
                               5.压缩阻力和内容吸附
                               6.内置大小


           第二部分: 1.SizeClass的简介
                                2.SizeClass+AutoLayout
                                3.约束安装和删除
                                4.视图安装和删除



 AutoLayout的原理:

               自动布局是对autoresizingMask的进一步改进,它允许开发者在界面上的任意两个视图之间建立精确的线性变化规则。所谓线性变化就是数学中的一次函数,即:

                                                                                       y = m*x + c

1.什么是约束:
       约束是指用来描述视图布局的规则,约束限定了事物彼此关联的方式并且指出如何对他们进行布局。


2.约束的线性关系:


    y = m * x + c
  
   y  : First Item           表示因变量
   =:Relation             表示相等关系
   X  : SecondeItem     表示自变量
   m:Multiplier          表示缩放比例系数
   C  : Constant            表示偏移常量 



表示子view的顶部和父view的顶部贴合。



IB元素约束列表





IB元素指南





添加约束的方式有:


      1.选择一个视图,按下control键,从一个视图拖拽到另一个视图,或者从一个视图拖拽到它的父视图,IB会根据拖拽的方向,显示出一个特定上下文的弹出菜单。
    
      2.选中一项或者多项,使用xcode上方的editor菜单项中的Align和pin 项或者xcode编辑器底部右边工具上的pin和Align来添加约束




优先级:
   
     AutoLayout通过优先级规则权衡各布局选项的重要性。设置优先级的规则,最大的好处是当规则发生突出时,系统会根据优先级排序来选择最重要的布局方式。


优先级默认设置的方式:
       250(Low)               750(High)                 1000(Required)    


内容吸附:


       内容吸附约束限制允许自身伸展和填充视图的程度。如果内容吸附优先级较高,则将视图的框架与内在内容大小相匹配 



注意:个人理解一般用在当使用的尺寸变大,同时不希望视图被拉伸时用  


压缩阻力:

           压缩阻力约束防止视图剪切内容,确保整个内容都呈现出来 。    




注意:个人理解一般用在当使用的尺寸变小时,同时不希望视图被压缩剪切时用


内置大小

   标签,图像视图和控件的大小通常取决于它们呈现的内容。


SizeClass:
        为屏幕的尺寸进行分类 ,通过不同类别的 Size 来定制各种尺寸的界面








Size Classes中的高和宽


       Size Classes为高和宽分别提供了三种类型:紧凑型(compact)、普通型(regular)、任意型(any)。用这三种高和宽的类型就可以组合出9种size class,来表示不同的设备屏幕。




注意:


      在size class为wAny/hAny的时候添加constraint,在其他size class的时候也生效。其实从字面上也可以看出,Any就是任何的意思,Compact和Regular是Any的子类

视图安装和删除


有时候光设置 Constraint 是无法满足比较复杂的需求的,比如大屏下我希望能显示三个按钮,分别对应:吃早饭,吃午饭,吃晚饭。但是在 iPhone 等小屏下可能放不下这么多按钮,只能显示一个按钮:吃饭。遇到这种情况,我们只能对 View 进行安装 (install) 和卸载 (uninstall)。


有时候我们可能会遇到比较复杂的设计,针对不同的尺寸需要有不同的布局


删除约束的方法:
     
       第一种:如图,取消勾选



       第二种:按住Command键,同时按下delete键



注意:这里讲的约束删除不是真正意义上的删除,只是说,在某个size中这个约束不合适使用,在这个size中把约束去掉,但是在其他size中有可能需要这个约束,不能把它给直接delete掉。否则会引起报错