iOS自动布局Autolayout讲解.pptx

Autolayout-自动布局 iOS学院 简介-iPhone屏幕适配的发展过程 直接使用 frame 计算控件的位置、大小(MagicNumber) iPhone3GS \ iPhone4 \ iPhone4S 屏幕的物理尺寸是一样的(无需屏幕适配), 而且一个应用要么是横屏要么是竖屏, 不存在能同时进行横竖屏切换的应用 使用 autoresizing进行屏幕适配（设置显示规则，只能按照父控件来设置参照） 随着iPad 的发布, 屏幕物理大小发生了变化, 并且要求部分应用程序实现横竖屏切换，所以不能把控件的 frame 都写死了，需要进行屏幕适配。 autoresizing的核心思想就是：参照父容器来设置子控件的 frame。不再写死 frame, 而是参照。 举例: 在竖屏下有一个按钮要占据整个屏幕宽度, 当切换到横屏下以后同样要占据整个屏幕的宽度 注意: autoresizing只能设置当前控件与父控件之间的相对关系 简介-iPhone屏幕适配的发展过程 使用 autolayout（从 iOS6开始）进行屏幕适配 随着 iPhone5 \ iPhone5s 等的发布苹果设备不同尺寸的屏幕变得越来越多, 不仅要求能根据控件父子关系来设置相对位置, 也要求能根据任意控件之间的关系来设置位置 因为 autoresizing只能设置当期控件与父控件之间的相对关系, 当遇到要设置兄弟控件之间的关系的时候 autoresizing就无能为力了 举例: 在竖屏下, 屏幕底部有两个按钮, 这两个按钮的间距为一个固定的值(宽度不指定); 当切换为横屏的时候要求这两个按钮还显示在屏幕底部, 并且按钮间的间距不变, 按钮可以随之变宽。 简介-iPhone屏幕适配的发展过程 使用 size classes + autolayout 进行屏幕适配 看时间作为补充, 今天的内容是Autolayout” 当 iPhone6发布以后, 苹果设备的屏幕越来越多(以后也可能出现更多不同大小的屏幕), 为了能更容易的适配不同的屏幕, 苹果推出了size classes 技术 通过 autolayout设置的约束, 约束一旦添加就会应用于各种屏幕（也就是说在各种不同的屏幕下都使用相同的约束） 通过 size classes + autolayout的方式, 可以为不同尺寸的屏幕设置不同的约束 举例: 在3.5 inch的屏幕下希望某个按钮紧贴屏幕上边显示, 但是当屏幕变成4.7 inch以后, 则希望该按钮显示到屏幕的正中央 size classes技术主要解决的问题: 为不同尺寸的屏幕, 通过 autolayout设置不同的约束。 屏幕适配发展总结 通过代码计算 frame Autoresizing（设置控件与父控件的相对关系,从而实现间接设置frame， ios系统在运行时会根据设置的规则, 计算出对应的frame,无需手动计算frame） 通过设置子控件与父控件的关系来决定如何显示控件 autolayout 通过设置某控件与任意其他控件间的关系来决定如何显示这个控件, 不仅仅局限与父子控件 size classes 通过 size classes + autolayout实现针对不同屏幕为控件设置不同的约束 注意 注意: 无论是通过 autoresizing 还是 autolayout 其实只是间接设置了控件的 frame, 所以一旦使用了 autoreszing 或者 autolayout 那么就不要在直接设置 frame 了, 否者可能产生混乱。 Autoresizing Autolayout 并且： autoresizing 和autolayout 二者是互斥的，同时只能使用其中一种，当使用autoresizing的时候必须禁用autolayout, 当使用autolayout的时候就无法使用Autoresizing了。 介绍 autoresizing的使用 只是为了介绍, 以后不要用 autoresizing, 都用 autolayout autoresizing 和 autolayout只能用其一 当使用 autoresizing 的时候就无法使用 autolayout, 反之亦然。 案例1: 要求： 1. 在控制器的 view 的四角放四个高宽都为100的 UIView。 2. 在不同尺寸的屏幕下都可以正确显示在四角。 目的: 说明 autoresizing 外面4根线的作用。 步骤: 1 选择3.5 inch的控制器, 在四角放四个 UIView, 设置宽高都是100, 并设置不同背景颜色 2 分别演示在iPhone4S \ iPhone5s \ iPhone6 不同模拟器下的效果（同时演示横屏下效果也不正常）, 说明如果不做屏幕适配, 那