1,自动布局是一种基于约束的布局(constraint-based layout)引擎,它可以根据开发者在对象上的约束自动调整大小与位置。

2.在iOS 6之前使用的布局模型是“spring&struts”模型。虽然大部分情况下运行很有效率,但旋转时仍然需要写代码为子视图自定义布局。

3.布局代码在layouSubviews方法中编写。

4.在Xcode 5中使用自动布局时第一个引人注目的变化是Xcode 5不会自动添加约束,除非你明确的要求Xcode添加。

Xcode 5让开发者控制布局,不会自动添加约束。

如果添加的约束不够定义布局,Xcode 5的故事板或者Interface Builder的编译器会生成警告,还会给出修复建议。

在Xcode 5中,如果没有添加任何约束,IDE会自动在运行时添加固定的位置和大小约束。

5.在Xcode 5中使用自动布局

打开故事板,可以看到如下四个按钮:

Align(第一个):用来添加对齐约束。

Pin():添加标准约束,比如相对于其他视图的大小和位置。

Reslove(解决) Auto Layout Issues(情况):可以让Xcode 自动生成约束,或者基于约束把子视图的边框更新到正确的位置。

Resizing Behavior:可以用来设置哪些类会继承这些约束。默认情况下,Siblings and Ancestors(兄弟姐妹和祖先)和Descendants(后代)都是选中状态。但是推荐把Silbings和Ancestors留空。如果选中的话,对齐视图中的子视图会变得很困难,子视图的原点固定,当你设置子视图的大小时,祖先视图会跟着变,这样很烦人。在创建布局时,会用到其他三个菜单按钮。

6.固有尺寸

iOS中大部分控件元素都有固有尺寸。打开尺寸查看面板(size inspector),会发现有些属性(eg:高度和宽度)无法修改。

7.固有尺寸和本地化

UILabel和UIButton的固有尺寸很有意思。固有尺寸反应了其内容,标题越长,标签的固有尺寸越宽,这种特性搭配自动布局能够容易创建可以根据不同语言的内突自动调整尺寸的按钮和标签。

8.设计时和运行时布局

Xcode 5不会自动添加约束。相反,如果添加的约束不能无歧义的描述布局,Xcode 5会显示一系列的警告或者错误,而且会高亮布局中的歧义。

大部分情况下,任何会导致用户界面错误布局的情况都会产生警告,并且运行时崩溃(主要由带歧义的约束造成)会被视为错误。设计时(即设计阶段,相对运行时而言)有问题的控件会用黄色实线框框起来,运行时有问题的控件则用红色虚线框框起来。

黄色框突出了有问题的控件,显示其在设计时的大小和位置,红色框则显示了其在运行时的大小和位置。

不要手动添加缺失的约束,点击第三个菜单按钮,选择“Add Missing Constraints”来让Xcode 自动添加。

9.自动更新边框

当某个视图位置不对时会出现如下所示的警告:

可以点击第三个按钮并选择Update Frames来消除这种警告。

10.顶部和底部布局引导

在iOS 7中,每个视图控制器都有两个属性,叫做topLayoutGuide和bottomLayoutGuide。Xcode 5将其显示为IB文档中的对象。我们可以把视图相对于这两个属性对齐。

11.辅助编辑器中的布局预览

Xcode 5的辅助编辑器也能预览用户界面,可以模拟iOS 6和iOS 7设备,以及横屏及竖屏。只要打开辅助编辑器,点击顶层路径式导航栏菜单的第一个按钮,选择Preview,就能在辅助编辑器面板中看到用户界面预览。预览面板会随着文档的修改而实时更新。

12.在设计时调试自动布局

Xcode 5调试自动布局比以前容易的多,以前只能在各种设备上运行应用然后等着崩溃。Xcode 5允许开发者在设计时可视化的处理这些崩溃。光这一点就是工作流上的巨大改进了。

自动布局有两类主要问题,第一类发生在约束集不足以定义所有可能的屏幕方向/尺寸下的布局时。第二类则是太多约束导致至少在一种屏幕方向下会产生冲突时发生的。

第一类问题大体上可以分为两种,边框歧义和视图摆放错误。当你没有添加约束来无歧义的确定视图在运行时的位置和大小时就会产生边框歧义。视图摆放错误则是边框歧义的副作用。设计时视图的大小和位置可能和运行时的大小和位置不匹配,这是Xcode 会警告视图摆放错误。通常添加必要的约束就能解决这个问题。

顾名思义,约束冲突发生在添加的约束互相之间会产生冲突时,这个时候,自动布局引擎会试图在运行时破坏约束(并且会打印一条消息列出被破坏的约束)并布局,如果失败就会产生运行时崩溃。约束冲突是仅有的无法在设计时发现的布局错误。在部分情况下,约束都是在某种屏幕方向下冲突的,可能你添加的约束在竖屏的情况下工作良好,到了横屏情况下却互相冲突了。

13.在自动布局中使用滚动视图

14.使用自动布局和边框

15.可视格式化语言及其缺点

16.调试布局错误

调试台日志会列出自动布局的约束。


我的CSDN博客地址:http://blog.csdn.net/qw963895582/article

掌握iOS自动布局的更多相关文章

  1. iOS 自动布局详细介绍

    1. 自动布局的理解 iOS自动布局很有用,可以在不同size的屏幕上运行,原先看的头痛,还是习惯用最蠢的[UIScreen mainScreen].bounds.size.width等来布局,后来实 ...

  2. iOS自动布局——Masonry详解

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由鹅厂新鲜事儿发表于云+社区专栏 作者:oceanlong | 腾讯 移动客户端开发工程师 前言 UI布局是整个前端体系里不可或缺的一环 ...

  3. IOS自动布局

    参考资料 https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/AutolayoutPG/Vi ...

  4. iOS自动布局之autoresizingi

    对于iOS的app开发者来说,不会像Android开发者一样为很多的屏幕尺寸来做界面适配,因此硬编码的坐标也能工作良好,但是从设计模式上来说这不是好的做法.而且也还有一些问题,如iPhone5的适配, ...

  5. 学会爱上iOS自动布局(Auto Layout) - 剑尖

    本文翻译自Yari Dareglia的LEARN TO LOVE AUTO LAYOUT文章先生们,女士们,让我们以正确的心态开始本教程吧:自动布局就是简单!我花了一段时间来掌握自动布局是如何工作的, ...

  6. iOS 自动布局过程

    自动布局将视图显示在屏幕上的步骤: 更新约束,它会从子视图传递到父视图,设置布局信息:约束更新时自动触发setNeedsUpdateConstraints:updateConstraints可以增加本 ...

  7. iOS 自动布局框架 – Masonry 详解

    目前iOS开发中大多数页面都已经开始使用Interface Builder的方式进行UI开发了,但是在一些变化比较复杂的页面,还是需要通过代码来进行UI开发的.而且有很多比较老的项目,本身就还在采用纯 ...

  8. iOS自动布局框架-Masonry详解

    首先,在正式使用Masonry之前,我们先来看看在xib中我们是如何使用AutoLayout     从图中我们可以看出,只要设置相应得局限,控制好父视图与子视图之间的关系就应该很ok的拖出你需要的需 ...

  9. IOS 自动布局-UIStackPanel和UIGridPanel(四)

    为什么说scrollview的自动化布局是难点? 对scrollview做自动化布局,无非就是想对scrollview里面的subviews来做自动化布局.但是scrollview里面的subview ...

随机推荐

  1. Jmeter Html 报告优化

    转载自南风_real博客园:http://www.cnblogs.com/jaychang/p/5881525.html 但是最近在查阅相关资料时,发现基本都是重复一篇文章Jmeter使用笔记之htm ...

  2. [ActionScript 3.0] AS3.0 水面波纹效果

    import flash.geom.Point; import flash.display.BitmapData; import flash.filters.DisplacementMapFilter ...

  3. 【cl】sikuli启动不了

    公司电脑:win7+64位 问题:点击sikuli_ide没有反应 卸载了,启动电脑,重新安装.

  4. 国内Lua先驱的Lua源码总结

    http://www.codingnow.com/temp/readinglua.pdf <Lua源码欣赏> By 云风

  5. 山东省第六届ACM省赛

    A.Nias and Tug-of-War(sort排序) B.Lowest Unique Price(set+map) C.Game!(博弈) D.Stars E.BIGZHUGOD and His ...

  6. C# 数据回滚

    public int GetExecteQuery(string strAddSql, string strUpdateSql, string strDelSql) { SqlConnection c ...

  7. [ZOJ 1011] NTA (dfs搜索)

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=1011 题目大意:在一棵树上,给你起始状态,问你能否到达终止状态. ...

  8. 使用jaxp对比xml进行DOM解析

    /*DOM解析编程 •遍历所有节点 •查找某一个节点 •删除结点 •更新结点 •添加节点 /* package cn.itcast.jaxp; import java.io.File; import ...

  9. 【转】find命令

    Linux中find常见用法示例·find path -option [ -print ] [ -exec -ok command ] {} \;find命令的参数: pathname: find命令 ...

  10. JQuery上传插件uploadify优化

    旧版的uploadify是基于flash上传的,但是总有那么些问题,让我们用的不是很舒服.今天主要分享下在项目中用uploadify遇到的一些问题,以及优化处理 官方下载 官方文档 官方演示 下面是官 ...