Autoresizing和Autolayout

Autolayout

• Autolayout是一种“自动布局”技术，专门用来布局UI界面的
• Autolayout自iOS 6开始引入，由于Xcode 4的不给力，当时并没有得到很大推广
• 自iOS 7（Xcode 5）开始，Autolayout的开发效率得到很大的提升,苹果官方也推荐开发者尽量使用Autolayout来布局UI界面
• Autolayout能很轻松地解决屏幕适配的问题

1. 核心概念

• 约束

  • 尺寸约束
    • width约束
    • height约束
  • 位置约束
    • 间距约束（上下左右间距）

• 参照

  • 所添加的约束跟哪个控件有关（相对于哪个控件来说）

2. 警告和错误

• 警告

  • 控件的frame不匹配所添加的约束, 比如
    • 比如约束控件的宽度为100, 而控件现在的宽度是110

• 错误

  • 缺乏必要的约束, 比如
    • 只约束了宽度和高度, 没有约束具体的位置

• 两个约束冲突

  • 比如: 1个约束控件的宽度为100, 1个约束控件的宽度为110

3. 代码实现Autolayout

• 代码实现Autolayout的步骤

  • 利用NSLayoutConstraint类创建具体的约束对象
  • 添加约束对象到相应的view上
    • - (void)addConstraint:(NSLayoutConstraint *)constraint;
    • - (void)addConstraints:(NSArray *)constraints;

• 代码实现Autolayout的注意点

  • 要先禁止autoresizing功能，设置view的下面属性为NO
    • view.translatesAutoresizingMaskIntoConstraints = NO;
  • 添加约束之前，一定要保证相关控件都已经在各自的父控件上
  • 不用再给view设置frame

4. NSLayoutConstraint

• 一个NSLayoutConstraint对象就代表一个约束

• 创建约束对象的常用方法

+(id)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c;
view1 ：要约束的控件
attr1 ：约束的类型（做怎样的约束）
relation ：与参照控件之间的关系
view2 ：参照的控件
attr2 ：约束的类型（做怎样的约束）
multiplier ：乘数
c ：常量

• 自动布局的核心计算公式

obj1.property1 =（obj2.property2 * multiplier）+ constant value

5. 添加约束的规则

• 在创建约束之后，需要将其添加到作用的view上
  • 在添加时要注意目标view需要遵循以下规则：
    • 1）对于两个同层级view之间的约束关系，添加到它们的父view上
    • 2）对于两个不同层级view之间的约束关系，添加到他们最近的共同父view上
    • 3) 对于有层次关系的两个view之间的约束关系，添加到层次较高的父view上

6. Autolayout后的一些变化

• 在没有Autolayout之前，UILabel的文字内容总是居中显示，导致顶部和底部会有一大片空缺区域
• 有Autolayout之后，UILabel的bounds默认会自动包住所有的文字内容，顶部和底部不再会有空缺区域

7. 基于Autolayout的动画

• 修改约束-动画
  • 设置好约束后,修改约束的值
  • 调用函数

//利用2s的时间去更新约束
[UIView animateWithDuration:2.0 animations:^{
    [self.view layoutIfNeeded];
}];

8. 常见单词

• Leading -> Left -> 左边
• Trailing -> Right -> 右边

9. UILabel实现包裹内容

• 设置宽度约束为 <= 固定值
• 设置位置约束
• 不用去设置高度约束

---

Autoresizing

• UIViewAutoresizingFlexibleLeftMargin = 1 << 0,
  • 距离父控件左边的间距是伸缩的
• UIViewAutoresizingFlexibleRightMargin = 1 << 2,
  • 距离父控件右边的间距是伸缩的
• UIViewAutoresizingFlexibleTopMargin = 1 << 3,
  • 距离父控件上边的间距是伸缩的
• UIViewAutoresizingFlexibleBottomMargin = 1 << 5
  • 距离父控件下边的间距是伸缩的
• UIViewAutoresizingFlexibleWidth = 1 << 1,
  • 宽度跟随父控件宽度进行伸缩
• UIViewAutoresizingFlexibleHeight = 1 << 4,
  • 高度跟随父控件高度进行伸缩