A little runtime excursion

为两个button都添加同一个ibaction方法在viewcontroller.m中实现如下的方法:

不论怎么变化,都会有如下的规律

  • The lower button is always center-aligned in the window, horizontally. 下方的button总是水平居中显示
  • The lower button always sits 20 points from the bottom of the window.  总是和底部保持特定的距离大小
  • The top button is always left-aligned with the lower button and 40 points above it. 左上方的button总是和下方的button左对齐并且总是保持特定间距

再次测试,删除Leading Alignment constraint,在align中选择Right Edges然后再运行看看区别。

然后可以选择Align\Horizontal Centers再次尝试。

Fixing the width

选择两个button然后选择Editor\Pin\Widths Equally

然后把下面的button的内容变成“X”,那么你会发现上面的button的显示不再正确了

那么auto layout又是怎么知道该使用哪个button的大小呢?选择Size to Fit Content应用到上面的button,运行app,两个button还是有相同的宽度,不论内容实际大小

运行app会发现两个button总是一样宽,不论哪个文本更宽些。当然当文本非常短时两个也一样短。除非一个约束来制约他们否则,buttons会很好的适应当前他们显示的内容,这个就是intrinsic content size

Intrinsic Content Size

Before Auto Layout, you always had to tell buttons and other controls how big they should be, either by setting their frame or bounds properties or by resizing them in Interface Builder. But it turns out that most controls are perfectly capable of determining how much space they need, based on their content.

A label knows how wide and tall it is because it knows the length of the text that has been set on it, as well as the font size for that text. Likewise for a button, which might combine the text with a background image and some padding.

The same is true for segmented controls, progress bars, and most other controls, although some may only have a predetermined height but an unknown width.

This is known as the intrinsic content size, and it is an important concept in Auto Layout. You have already seen it in action with the buttons. Auto Layout asks your controls how big they need to be and lays out the screen based on that information.

Usually you want to use the intrinsic content size, but there are some cases where you may not want to do that. You can prevent this by setting an explicit Width or Height constraint on a control.

Imagine what happens when you set an image on a UIImageView if that image is much larger than the screen. You usually want to give image views a fixed width and height and scale the content, unless you want the view to resize to the dimensions of the image.

选择Pin\Width可以复写他自带的Intrinsic Content Size功能。

Attributes inspector. Change Constant to 80,运行app会发现如下的情况。因为两个button的宽度要一致。但是上面的指定了固定的宽度,导致了即便文字宽度改变了但是button的宽度缺无法再变化了。

Note: You probably wouldn’t set a Width constraint on a button by design – it is best to let the button use its intrinsic size – but if you ever run into a layout problem where you expect your controls to change size and they don’t, then double check to make sure a fixed Width constraint didn’t sneak in there.

Beginning Auto Layout Tutorial in iOS 7: Part 4的更多相关文章

  1. Beginning Auto Layout Tutorial in iOS 7: Part 3

    How Auto Layout works 在使用auto layout之前,你可能总是使用initWithFrame或者frame, bounds or center属性. 使用约束的好处在于你不需 ...

  2. Beginning Auto Layout Tutorial in iOS 7: Part 6

    Gallery example 屏幕有四个分开的相同的矩形,每个矩形有一个label和一个image view.创建一个Gallery的项目.在Main.storyboard中,拖拉一个view大小为 ...

  3. Beginning Auto Layout Tutorial in iOS 7: Part 1

    可以更好的结局屏幕方向和兼容iphone和ipad的解决方案. iOS6有一个新的技术auto layout来帮助解决这个问题.这个技术不仅可以支持app不同尺寸下的开发,而且你也不需要为每一种语言创 ...

  4. Beginning Auto Layout Tutorial in iOS 7: Part 2

    Auto Layout to the rescue! 接下来就看看如何使用Auto Layout来实现这个效果. 首先移除viewWillLayoutSubviews方法,选择Main.storybo ...

  5. Swift语言Auto Layout入门教程:上篇

    原文:Beginning Auto Layout Tutorial in Swift: Part 1/2,译者:@TurtleFromMars 开始用自动布局约束的方式思考吧! 更新记录:该教程由Br ...

  6. iOS布局之Auto Layout

    学习资源: <iOS6核心编程>自动布局部分 <iOS6范例经典>自动布局部分 Tutorial: iOS 6 Auto Layout versus Springs and S ...

  7. How to Use Auto Layout in XCode 6 for iOS 7 and 8 Development

    The Auto Layout is available on the Storyboard for iOS or OS X development since XCode 5. But, I did ...

  8. iOS Programming Auto Layout: Programmatic Constraints 自动布局:通过编程限制

    iOS Programming  Auto Layout: Programmatic Constraints  1.  However, if your views are created in co ...

  9. 【转】使用 Auto Layout 的典型痛点和技巧

    layoutIfNeeded()强制立刻更新布局 原文网址:http://www.jianshu.com/p/0f031606e5f2 官方文档:Auto Layout Guide 加上去年WWDC上 ...

随机推荐

  1. day40--mysql step4 SQLAlchemy

    1.unique = True 表示启动唯一索 2.有add 必须有commit这样数据才会提交 3.ORM功能 #!/usr/bin/env python # -*- coding:utf-8 -* ...

  2. msconfig.exe

    msconfig.exe 编辑 本词条缺少概述.名片图,补充相关内容使词条更完整,还能快速升级,赶紧来编辑吧!   中文名 微软系统配置实用程序 外文名 msconfig.exe 出品者 Micros ...

  3. 试水新的Angular4 HTTP API

    本文来自网易云社区 作者:梁月康 原文:https://netbasal.com/a-taste-from-the-new-angular-http-client-38fcdc6b359b Angul ...

  4. 如何选择Android自动化框架的几点拙见

    首先由于我自己也是个新手,也是在学习各种框架然后给公司项目选定相应自动化框架,研究移动自动化测试框架也就近段时间而已,所以我只能从我自己今天为止的认知角度给各个框架抒发我自己的拙见,你看是否能从中接纳 ...

  5. Google Optimize 安装使用教程

    Google Optimize 介绍 打开链接 https://optimize.google.com/optimize/signup/ 填入电邮地址后等待注册邀请 Google Optimize是什 ...

  6. thulac安装问题

    目标:在anaconda里面安装thulac. 1.打开Anaconda Prompt 2.输入pip install thulac 结果:报错! 报错画面如下: 解决方案: 1.到https://p ...

  7. Leetcode 654.最大二叉树

    最大二叉树 给定一个不含重复元素的整数数组.一个以此数组构建的最大二叉树定义如下: 二叉树的根是数组中的最大元素. 左子树是通过数组中最大值左边部分构造出的最大二叉树. 右子树是通过数组中最大值右边部 ...

  8. Kotlin-Not enough information to infer parameter T in fun<T:View> findViewById(id: Int): T!

    代码改变世界 错误: Type inference failed : Not enough information to infer parameter T in fun<T:View> ...

  9. [SDOI2015][bzoj3993] 星际战争 [二分+最大流]

    题面 传送门 思路 首先,有一个非常明显的模型: 将激光武器放到一边,机器人放到另一边,从每一个激光武器向它可以攻击的机器人连边,形成一个二分图 建立附加源点$ss$和附加汇点$tt$,$ss$连所有 ...

  10. BZOJ2806 [Ctsc2012]Cheat 【后缀自动机 + 二分 + 单调队列优化DP】

    题目 输入格式 第一行两个整数N,M表示待检查的作文数量,和小强的标准作文库 的行数 接下来M行的01串,表示标准作文库 接下来N行的01串,表示N篇作文 输出格式 N行,每行一个整数,表示这篇作文的 ...