6.3 添加edges/top/bottom/leading/t

1. 本节课将为您演示，如何给位于滚动视图中的标签视图，添加约束关系。首先在左侧的项目导航区，打开视图控制器的代码文件。

image

2. 接着开始编写代码，创建一个滚动视图，并在滚动视图中添加一个标签控件。

image

3. 首先在当前的类文件中，引入已经安装的第三方类库。

image

4. 然后初始化一个布尔变量，用来标识是否已经给视图对象添加了约束关系。

image

5. 接着依次初始化一个滚动视图控件，和一个内容视图控件，作为当前类的两个属性。

image

6. 添加一个标签控件，作为当前类的第四个属性。

image

7. 对标签进行初始化操作，然后设置标签的背景颜色为橙色。

image

8. 设置标签不限制内容的行数。

image

9. 设置文字在超过标签视图边界时的换行模式：按单词分割换行，标签末尾不会出现被分割的单词。

image

10. 设置标签控件的文字颜色为白色。

image

11. 接着设置标签的文字内容，并返回设置好的标签控件。

image

12. 将滚动视图添加到根视图中。

image

13. 设置内容视图的背景颜色为棕色。

image

14. 将内容视图添加到滚动视图中。

image

15. 然后将标签添加到内容视图中。

image

16. 调用视图对象的刷新约束的方法。

image

17. 添加一个方法，用来刷新视图的约束关系。

image

18. 当还没有给视图对象添加约束时，给五个视图添加约束关系。首先给滚动视图添加约束关系。

image

19. 在滚动视图和根视图之间建立约束关系，设置滚动视图和根视图的边距为0，即滚动视图的显示区域，始终和根视图保持相同。

image

20. 接着给内容视图添加约束关系。

image

21. 在内容视图和滚动视图之间建立约束关系，设置内容视图和滚动视图的边距为0，即内容视图的显示区域，始终和滚动视图保持相同。

image

22. 设置内容视图的宽度，等于滚动视图的宽度。

image

23. 继续给标签对象添加约束关系。

image

24. 设置标签对象的顶边和底边，与父视图保持20点的间距。

image

25. 设置标签对象的左边和右边，同样和父视图保持20点的间距。

image

26. 然后更改布尔变量的值，标识当前已经完成对三个控件的约束。

image

27. 最后调用父对象的刷新视图约束的方法，接着点击左上角的[编译并运行]按钮，启动模拟器预览项目。

image

28. 模拟器启动后，在屏幕上显示一个位于内容视图内的标签视图，它们的间距约束为20点。最后点击此处的[停止]按钮，关闭模拟器并结束本节课程。

image

本文整理自：《app开发中的神兵利器》，真正的[手把手]教学模式，用最快的速度上手iOS开发，苹果商店App Store免费下载：https://itunes.apple.com/cn/app/id1209739676，或扫描本页底部的二维码。课程配套素材下载地址：资料下载

apps8 2.png