[Xcode 实际操作]三、视图控制器-(11)在Storyboard中使用表格控件

目录：[Swift]Xcode实际操作

本文将演示表格控件在故事板中的使用。

点击【显示或隐藏检查器按钮】，再界面右侧打开检查器面板。

在控制器根视图上点击鼠标，以选择该根视图。

现在往根视图中添加一个表格视图。

点击【库面板】图标，打开控件库面板

在控件库搜索框内，输入控件名称Table View，在控件库中，快速定位目标控件。

然后在按钮控件上双击，导入所需的控件。

在表格定界框的右下角按下鼠标，并向右下角拖动，以调整表格控件的尺寸。

然后点击库图标，再次打开控件库面板。添加一个单元格控件：Table View Cell

将导入的单元格控件，拖动到表格视图里。即在根视图左侧的文件树中拖动文件。

接着选择表格视图控件，点击【尺寸检查器】图标，打开尺寸检查器面板。

【Row Height】:60（行高）

接着选择单元格控件，同样设置单元格的高度。

【Row Height】:60（行高）

点击选择单元格的内容视图，接着往单元格的内部，添加一些新的控件。

点击【库面板】图标，打开控件库面板，以同样的方式，将图像视图添加到单元格中。

在宽度输入框内，输入图像视图的宽度数值。

在高度输入框内，输入图像视图的高度数值。

在X输入框内，输入图像视图在单元格内的横向坐标值

在Y输入框内，输入图像视图在单元格内的纵向坐标值

点击【属性检查器】图标，进入属性设置面板。

【Image】:输入图片的名称，设置图像视图默认显示的图片。

点击【库面板】图标，打开控件库面板，以同样的方式，将标签控件添加到单元格中。

将添加的标签对象拖动至单元格内适当位置，鼠标在标签定界框上按下，调整标签的宽度。

【Tag】:在标识输入框内，设置标志值，通过标志值，就可以在代码中获取该标签控件。

【重要】在故事板元素列表中，选择根视图中的表格控件，现在给表格添加代理对象：

在表格控件上按下鼠标右键，然后拖动到视图控制器图标，

在弹出的列表中，选择【dataSource】数据源选项，设置表格的数据源，为当前的视图控制器

继续在表格上按下鼠标的右键，然后拖动到视图控制器。

在弹出的列表中，选择【delegate】代理选项，设置表格的代理。

然后选择单元格控件，设置单元格的重用标识符。

【Identifier】:reusedCell

点击【隐藏或显示检查器】按钮，隐藏检查器面板。

点击打开视图控制器的代码文件。

import UIKit
//给视图控制器类添加两个代理协议：
//一个是表格视图的数据源协议，另一个是表格视图的代理协议。
class ViewController: UIViewController,UITableViewDelegate, UITableViewDataSource {

    //创建一个数组，
    //该数组里面的数据，将作为表格数据的来源。
    var fruits = ["Apple", "Banana", "Chinese Date", "Downy Picch", "Filbert", "Gingko", "Hawthorn", "Kumquat"]
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
    
    //添加一个表格代理方法，用来设置表格的行数。
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        //这里设置将数组的长度作为表格的行数
        return fruits.count
    }
    
    //添加一个代理方法
    //用来初始化和返回表格视图的单元格，是最主要的一个代理方法。
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        //创建一个字符串，作为单元格的标识符，
        //也就是上文在故事板中，给单元格控件设置的那个重用标识符。
        let identifier = "reusedCell"
        //单元格的标识符，可以看作是一种重用机制，此方法可以从所有已经开辟内存的单元格里面，
        //选择一个具有同样标识符的、空闲的单元格。
        let cell = tableView.dequeueReusableCell(withIdentifier: identifier, for: indexPath)
        
        //通过在故事板中设置的标志值，获得单元格中的标签控件。
        let label = cell.viewWithTag(1) as! UILabel
        //根据表格行的编号，从数组中获得对应的字符串，从而设置标签的文字内容。
        label.text = fruits[(indexPath as NSIndexPath).row]
        
        //最后返回设置好的单元格对象。
        return cell
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}