iOS UI设计: autolayout约束的一点技巧

布局的重点是先大后小，先整体后局部，先不变后可变。

0.    布局的技巧。鼠标点左边的某个view或者label或者button 然后按住command鼠标移到想要参照的view上，就会弹出小窗口选择top,leading,vertical等等。选好后还可以在最右边的属性面板接着改。

每次改完都update frames看最新效果。

 

1.    

 

剪头指向的3个部分是3个小整体可以用3个View装。先布局这3个View

先把第一个View1设置与 superView的top，height还有(leading=0,trailing=0)就能确定长宽和位置了了。然后View2以View1为参照设置top,height还有leading,trailing. 最好View3 同理。相对布局主要就是参照物的选举。这样3大块就相对固定了。如果要调View1与SuperView的top=20 后面的View2,View3自然会自己活动。

 

2.    最难的就是View1里面的布局

首先选择容易的“姓名” 设置好top,leading,一般字体不用设置高度就行。

然后下面的”线” 设置好(leading=20, top) 你会发现宽度不知道设置多少，因为长度刚好到了“手机联系人旁边的线“。 所以这里先设置这条线，然后又发现这条线的位置依赖”手机联系人“所以又先设置”手机联系人”。

。。。。。

3.    总而言之就是先找不容易变的再把容易变的参照不容易变的设置约束。

4.    联系方式，所在地区，详细地址的top都是对应上面那根线，leading不能设置，因为是右对齐，只需要参照“姓名“设置 姓名.trailing==联系方式.trailing就行。

5.    leading就是左 trailing是右，  horizon是水平， vertical是垂直， center是中央。