IOS7配置自动布局的约束

时间:2022-07-26 13:12:32

上一篇博客记录了怎么使用代码对视图进行约束,原文:点击打开链接

这次记录一下关于自动布局的例子,

1.创建一个Single View Application :

2.选择自动布局:

IOS7配置自动布局的约束

3.拖拽两个TextField和一个按钮到视图中,把他们放在屏幕的水平位置的*,运行:

手机竖屏的时候,很好看:

IOS7配置自动布局的约束

横屏的时候就变成了这个鸟样子,()

IOS7配置自动布局的约束

当然你可以用代码添加约束,不过有了autoLayout 一切是那么的美好。

4.选中两个Text Field按照下图设置垂直间距,

IOS7配置自动布局的约束

按照上边的方法依次设置,

三个构件的leading space to superview 和trailing space to superview

下边textfile 和button 的vertical spacing

上边 TextFiled的top space to superview

设置完后约束图如下

IOS7配置自动布局的约束

必须所有的约束线全部变成蓝色 ,如果是红色说明约束还没设置完整,

可以点击红色箭头查看缺少的约束。

IOS7配置自动布局的约束

设置完后运行效果如下:

IOS7配置自动布局的约束

IOS7配置自动布局的约束