最近频繁使用AutoLayout,记录下自己的一些发现和问题的解决(不是教程)
1.简介
Auto Layout 是苹果在 iOS 6中新引入的布局方式,旨在解决不同尺寸屏幕的适配问题。
屏幕适配工作在 iPhone 6 及 plus 发布以后变得更加重要,而且以往的“硬编程”的工作量大幅增加,所以很多人开始学习使用 Auto Layout 技术。
2.核心思想
Auto Layout 的本质是依靠 某几项约束条件 来达到对某一个元素的定位。
我们可以在某个地方只使用一个约束,以达到一个小目的,例如防止内容遮盖、防止边界溢出等。
但我的最佳实践证明,如果把页面上每一个元素的位置都用 Auto Layout 进行 “严格约束” 的话,那么 Auto Layout 可以帮我们省去非常多的计算 frame 的代码。
“严格约束” 是什么?
简单来说,严格约束就是对某一个元素的绝对定位,让它在任一屏幕尺寸下都有着唯一的位置。
这里的绝对定位不是定死的位置,而是对一个元素 完善的约束条件。
让我们看图说话:
- 我们要在一个直角坐标系里描述一个矩形。
- 那么只需要指定这个矩形的位置和大小。
- 那么只要给出上图中的四个值即可:到左边界的距离,到上边界的距离,宽度,高度。
- 这四个约束是最简单的情况。在对一个元素进行严格约束时,请直接在脑中构建这个元素,并且加上几条约束条件,如果他无法缩放和动弹,那么严格约束就是成功的!
- 必须牢记,使用 Auto Layout 时最重要的是:对页面上每一个元素都进行严格约束,不严格的约束是万恶之源。
3.容易犯的错误
如果预览的样式和你预想的不一样,检查一下是不是忘记给作为背景的 view 添加约束(上下左右),可能有一个约束缺失,导致整体样式出错。
4.找不到原因的情况
在 ScrollView 中通过 AutoLayout 设置 StackView 子视图不固定宽度时,需要设置和 superview Equal Widths,然后根据需要调整间距。
否则子视图宽度约束设置不生效。如果出现其他 view 宽度不对劲的情况,也可以试着用 Equal Widths 解决。
如图,分别为宽度不正常情况和使用 Eauql Widths 之后正常情况:
5.一点闲话
据说Android在最新的version中也开始使用这种约束,不知道是不是真的,但是如果Android也实现了这种技术的话真的非常有用。