Autolayer入门指南

在最近新开的iOS项目中,尝试使用了Autolayer布局,来满足不同屏幕尺寸的适配。这里写一篇在应用过程中的小经验,算是入门的记录。

定义:Autolayer是一种自动布局技术,类似于网页使用Div排版的方式,抛弃了以前的Frame绝对定位,而是通过控件之间的距离来确定最终显示的效果。

基本属性

  • Autolayer将视图间的关系称之constraints(约束), 意为通过一个视图的属性来定义另一视图的属性. 所以使用Autolayer后, 基本可以无视早期重要的Frame属性, 因为在实际运行中, Frame属性会随屏幕大小来动态确定.
  • 对于任一控件,它拥有的Autolayer不外乎这么几种属性,上下左右边距、垂直中心、水平中心、高、宽、高宽比例、比例。
  • 上下左右边距,就是这一控件与其他控件的距离,可以是控件的父视力superView,也可以是附近的视图,还可以是专门用于定位的辅助视图(这个后面会说到)。
  • 垂直中心、水平中心的定义更为简单,就是这一控件处在父视图的中心点所在的位置。
  • 高宽,一般是用来强制定义控件的形状,确保有些控件的大小、比例不会被压缩和改变,确保压缩效果。
  • 比例: 通过定义比例, 来确定两个视图间大小的关系。 例如:1:0.5, 即为前一视图的某一值为后一视图的2倍。

使用

  • 使用Autolayer很简单, 只要在Storyboard中, 通过按住control键, 从一个view A指向另一个view B, 即为指定View A的某项属性与View B的属性相关.
  • 指向Autolayer相关属性时, 可以使用Shift同时指定多重关系.
  • 尽量不要使用系统自动根据storyboard图自定义constraints来定义Autolayer, 那样拉出来的constraints基本无法使用.

一些坑

  • 相对于早前使用Frame等固定数值的视图配置, Autolayer在对大小屏幕的适应上非常方便.但也带来一些不便, 例如动画精确运行问题, 约束过于复杂和易变.
  • 对于需要多个视图间隔相等, 例如要求三个button, 在横向等宽等距间隔相等, 这时候就必须引入空白View位于三个Button中间, 互相确定constraints来实现. 这无形中增加需要管理的View对象.
  • 对于一个复杂视图的Autolayer关系修改将是一个无比头疼的事, 需要一开始就做好规划.

Comments

No comments yet. Why don’t you start the discussion?

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注