博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iOS 自动布局注意事项
阅读量:4087 次
发布时间:2019-05-25

本文共 3315 字,大约阅读时间需要 11 分钟。

使用 Autoresizing 进行屏幕适配随着 iPad 的发布, 屏幕的物理尺寸发生了变化并且苹果建议,在 iPad 上运行的程序如果没有特殊原因,应该支持横竖屏切换因此:不能把控件的 frame 都写死了,需要进行屏幕适配为了解决屏幕适配需求,苹果同时推出了第一个屏幕适配解决方案:AutoresizingAutoresizing 的核心思想就是:参照父容器来设置子控件的 frame不再写死 frame, 而是参照父容器举例:在竖屏下有一个按钮要占据整个屏幕宽度, 当切换到横屏以后同样要占据整个屏幕的宽度Autoresizing 只能设置当前控件与父控件之间的相对关系
iOS 6 —— Auto Layout(自动布局)随着 iPhone5 \ iPhone5s 等的发布苹果设备不同尺寸的屏幕变得越来越多, 不仅要求能根据控件父子关系来设置相对位置,也要求能根据任意控件之间的关系来设置位置因为 Autoresizing 只能设置当前控件与父控件之间的相对关系,当遇到要设置兄弟控件之间的关系的时候 Autoresizing 就无能为力了举例: 在竖屏下, 屏幕底部有两个按钮,这两个按钮的间距为一个固定的值(宽度不指定)当切换为横屏的时候要求这两个按钮还显示在屏幕底部并且按钮间的间距不变, 按钮可以随之变宽Auto Layout 技术主要解决的问题:控件位置的参照关系不再局限于父控件
iOS 8 —— Size Classes + Auto Layout使用 Size Classes + Auto Layout 进行屏幕适配当 iPhone6 发布以后,苹果设备的屏幕越来越多(以后也可能出现更多不同大小的屏幕),为了能更容易的适配不同的屏幕,苹果推出了 Size Classes 技术通过 Auto Layout 设置的约束,约束一旦添加就会应用于各种屏幕(也就是说在各种不同的屏幕下都使用相同的约束)通过 Size Classes + Auto Layout 的方式, 可以为不同尺寸的屏幕设置不同的约束 举例: iPhone 下的计算器,在横屏、竖屏下的不同表现Size Classes 技术主要解决的问题:"主要解决了iPhone横竖屏适配及iPhone和iPad开发时共用一个SB的问题"
iOS 9 —— Size Classes + Auto Layout + StackViewStackView 的核心便是方便垂直或水平排布多个 subview类似于 android 的 LinearLayoutStackView 最有用的就是它会自动为每个 subview 创建和添加 Auto Layout 约束,程序员可以通过选项配置subview的大小、排布以及彼此间的间距使用 stackview 主要简化在线性方向上,重复设置控件布局约束的问题

Autoresizing

  • 除了很老的项目,目前没有使用 Autoresizing的了,都用 Auto Layout
  • 在一个视图中 Autoresizing 和 Auto Layout 只能用其一,通过 Autoresizing 解决布局问题,首先取消掉 Auto Layout
  • Autoresizing 取消AutoLayout代码
    • 谁约束,谁禁用,如:myView就是调用者
      • myView.translatesAutoresizingMaskIntoConstraints = NO;
    • 手动创建的视图默认的会开启外面四条边,下面是手动开启里面的两条边
      • View.AutoresizingMask=UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight;

Autoresizing-外面四根线

  • 外面四根线的含义?
    • 外面的四根线:子控件距离父控件的四周边距是否固定,如果子控件的尺寸固定,那么子控件的右下间距就无法固定”默认左上角间距优先四周的线选上固定反之不固定

Autoresizing-里面两根线

  • 里面两根线的含义?
    • 子控件的宽高是否随着父控件的宽高变化 内部两根线选上宽高不固定反之固定

Autoresizing-局中

  • 需求:
    • 在界面上放置一个红色的 View 100 * 100
    • 在任何设备上始终保持屏幕居中
  • 步骤:
    • 把所有的线都去掉(留个印象,防止接手很古老的项目)

Autoresizing-全屏

  • 手动创建代码后,加上如下代码,遍可以横竖都全屏
    • 横竖屏都全屏
    • myView.AutoresizingMask=UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

自动布局的间距介绍

  • constrain to margins一般不勾选,因为涉及到计算.
  • 代码中view的layoutMargin属性含义?
    • 可以更改view的margin,用来批量减少边距,调整子控件的位置.
  • 控制器的根视图是不能修改layoutMargin的,其他的视图可以.
  • top layout guide和bottom layout guide,默认控件的上下是参考这两根线,因为可能涉及到UITabBar 和 UINavgiationBar的问题.(了解)
  • 一部分控件可以不需要设置宽高的约束,和内容一样.(label,button,swtich,有图片的imageView)

* AutoLayout核心公式: *

* firstItem.firstAttribute {==,<=,>=} secondItem.secondAttribute * multiplier + constant *

注意:如果firstItem.firstAttribute和secondItem.secondAttribute调换位置后注意multiplier和constant值的变化

例:redW = 300   blueW = 200300  == 200  *  2   + -100200  == 300  * 0.5  +  50;

自动布局动画

  • 约束可以连线,既我们自定义的宽高距离约束.
  • 更改约束后,在block动画中调用layoutIfNeeded
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *myViewTop;self.myViewTop.constant += 400;

自动布局动画原理

  • 修改约束数值并不会让视图的位置及大小立即发生变化
  • 自动布局系统 会在一次用户交互活动中,收集所有控件的约束变化
  • 如果有约束变化,会在收集完成之后,统一计算所有控件变化后的 frame 并且设置
  • layoutIfNeeded 方法就是通知视图,如果当前存在变化的约束,先更新一下

代码中使用AutoLayout的注意点:

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

约束添加规则

1.如果添加的约束和其它控件没有关系, 要添加到自己身上"也可以添加在父控件上"2.如果是父子关系, 设置子控件的约束, 约束要添加到父控件上3.如果是兄弟关系, 设置两兄弟的约束, 约束要添加到它们最近的共同父控件上

Xcode版本信息

Xcode版本 正式版发布时间 支持系统及设置
Xcode4.2 2011年10月13日 iOS5-iPhone4s
Xcode4.5 2012年9月20日 iOS6-iPhone5
Xcode5.0 2013年9月18日 iOS7-iPhone5s
Xcode6.0 2014年9月17日 iOS8-iPhone6
Xcode7.0 2015年9月28日 iOS9-iPhone6s)

转载地址:http://cykii.baihongyu.com/

你可能感兴趣的文章
【UGUI/NGUI】一键换Text/Label字体
查看>>
【C#】身份证本地验证
查看>>
【Unity】坑爹的Bug
查看>>
【算法】求数组中某两个数的和为目标值
查看>>
如何高效学习动态规划?
查看>>
动态规划法(六)鸡蛋掉落问题(一)
查看>>
LeetCode 887.鸡蛋掉落(C++)
查看>>
Dijkstra‘s algorithm (C++)
查看>>
奇异值分解(SVD)的原理详解及推导
查看>>
算法数据结构 思维导图学习系列(1)- 数据结构 8种数据结构 数组(Array)链表(Linked List)队列(Queue)栈(Stack)树(Tree)散列表(Hash)堆(Heap)图
查看>>
求LCA最近公共祖先的离线Tarjan算法_C++
查看>>
Leetcode 834. 树中距离之和 C++
查看>>
【机器学习】机器学习系统SysML 阅读表
查看>>
最小费用最大流 修改的dijkstra + Ford-Fulksonff算法
查看>>
最小费用流 Bellman-Ford与Dijkstra 模板
查看>>
实现高性能纠删码引擎 | 纠删码技术详解(下)
查看>>
scala(1)----windows环境下安装scala以及idea开发环境下配置scala
查看>>
zookeeper(3)---zookeeper API的简单使用(增删改查操作)
查看>>
zookeeper(4)---监听器Watcher
查看>>
zookeeper(2)---shell操作
查看>>