原文:http://coolketang.com/staticCoding/5a991050128fe1189bdb1337.html

1. 本节课将为您演示,表格控件在故事板中的使用。首先打开之前创建的单视图项目。 

3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

2. 然后打开故事板文件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

3. 点击显示或隐藏检查器按钮,在界面右侧显示检查面板。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

4. 在表格上按下鼠标,然后将表格,从控件库面板中,拖动到视图控制器的根视图。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

5. 然后在表格定界框右上角按下鼠标,并向右上角拖动,调整表格控件的尺寸。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

6. 在表格控件定界框底部按下鼠标,并向下方拖动,调整表格控件的高度。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

7. 接着在单元格上按下鼠标,将单元格控件从控件库中,拖动到表格控件内部。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

8. 在故事板元素列表中,选择根视图中的表格控件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

9. 然后在行高输入框内,输入单元格的高度。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

10. 以同样的方式,将图像视图从控件库中,拖动到单元格中。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

11. 在宽度输入框内,输入图像视图的宽度数值。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

12. 接着在高度输入框内,输入图像视图的高度数值。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

13. 在X输入框内,输入图像视图在单元格内的横向坐标值。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

14. 在Y输入框内,输入图像视图在单元格内的纵向坐标值。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

15. 点击属性检查器图标,进入属性设置面板。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

16. 然后输入图片的名称,设置图像视图默认显示的图片。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

17. 在控件搜索框内,输入控件的名称,搜索目标控件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

18. 将标签控件,从控件库拖动到单元格内。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

19. 然后将标签对象,拖动至单元格内适当位置。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

20. 在标签右侧定界框上按下鼠标,并向右侧拖动,调整标签的宽度。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

21. 点击字体箭头,调整字体大小。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

22. 点击垂直滚动条,显示隐藏的标签属性。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

23. 在标识输入框内,给标签控件,设置标识值。通过标识值,就可以在代码中获取该标签控件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

24. 在故事板元素列表中,选择根视图中的表格控件。现在给表格添加代理对象。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

25. 在表格控件中,按下鼠标右键,然后拖动到视图控制器图标。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

26. 在弹出的列表中,选择数据源选项,设置表格的数据源,为当前的视图控制器类。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

27. 另外一种设置表格代理的方式是,在故事板左侧的文档框架区,在表格控件上按下鼠标右键,然后拖动到视图控制器图标。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

28. 在弹出的列表中,选择代理选项,设置表格的代理。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

29. 然后选择单元格组件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

30. 设置单元格的重用标识符。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

31. 点击打开视图控制器代码文件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

32. 点击隐藏或显示检查器图标,隐藏检查器面板。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

33. 然后给视图控制器类,添加两个代理协议。一个是表格视图的数据源协议,另一个是表格视图的代理协议。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

34. 接着创建一个数组。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

35. 该数组里面的数据,将作为表格数据的来源。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

36. 添加一个表格代理方法,用来设置表格的行数。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

37. 添加一个表格代理方法,用来初始化和返回表格视图的单元格,是最主要的一个代理方法。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

38. 创建一个字符串,作为单元格的标识符。也就是您在故事板中,给单元格控件设置的那个重用标识符。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

39. 单元格的标识符,可以看作是一种重用机制,此方法可以从,所有已经开辟内存的单元格里面,选择一个具有同样标识符的、空闲的单元格。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

40. 通过您在故事板中设置的标识值,获得单元格中的标签控件。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

41. 根据表格行的编号,从数组中获得对应的字符串,从而设置标签的文字内容。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

42. 最后返回设置好的单元格对象。点击[编译并运行]按钮,运行模拟器预览项目。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

43. 鼠标按下并向上拖动,查看下方隐藏的表格内容。 
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]

本文整理自:《互动教程 for Xcode9 & Swift4》,真正的[手把手]教学模式,用最快的速度上手iOS开发,苹果商店App Store免费下载:https://itunes.apple.com/cn/app/id1063100471,或扫描本页底部的二维码。课程配套素材下载地址:资料下载
3.11 在Storyboard中使用表格控件 [原创iOS开发-Xcode教程]



相关文章: