Xcode使用介绍之四：自动布局初体验

苹果自推出iPhone6之后，常见的屏幕的尺寸已经增加到4种，包括3.5寸、4寸、4.7寸和5.5寸，另外有时还需要考虑横屏状态下的显示效果。为了适配不同尺寸的界面布局，Xcode中引入了自动布局技术。自动布局通过控件与控件之间的“约束”关系，来确定一个控件在界面中的绝对位置和大小。基于自动布局，开发者只需要完成一次布局，即可适配所有尺寸的iPhone机型。

一、自动布局简介

Xcode中，提供了2种约束类型：

• align对齐约束：通过控件和控件之间的对齐关系添加约束；

• pin位置约束：通过控件与控件之间的位置关系，以及控件自身的大小添加约束；

当添加的约束关系不足以确定该控件的绝对位置和大小时，Xcode会给出提示：

• 红色的提示代表错误，一般是由于缺少约束条件造成的，必须修正；

• 黄色的提示代表告警，一般是由于控件设置的frame与约束有冲突，建议修正，同时Xcode也提供自动修正的功能。

控件添加约束后，可以在“size inspector”中查看、修改、删除已经添加的约束。

二、案例实践

在前面章节的代码基础上，我们来给界面上的UIImageView以及UIButton添加约束。

• UIImageView添加如下约束：大小固定240*128、距离屏幕顶端40PX、居中显示；
• UIButton添加如下约束：大小固定98*30、位于屏幕中心。

至此，可以选择在不同尺寸的iPhone模拟器上，检查控件的位置，同时可以旋转iPhone，测试在横屏状态下的显示效果。