[相关信息:Xcode7.2 ; Swift2.0]
先回顾一下效果图

看起来还不错的设计图
接下来我们需要把第一页列表页做起来

添加Table View控件

为Table View添加Table View Cell (行)

在Table View Cell里面添加需要的控件
添加完之后我们运行下APP会发现,列表还是空的?那是因为Table View没有绑定数据,而且数据也没有,当然显示出来的列表也会是空的。
好,那接下来我们要让列表显示出来

绑定Table View到View Controller,设置Table View Cell 的 identifier

同时显示 SB*(Main.storyboard)* 和代码窗口

选择正确的类文件

按住control键拖动到代码窗口

设定绑定的名称,点击添加完成绑定

Table View与代码绑定成功图

在ViewController.swift类里面实现Table View的两个方法
// MARK: - Table view data source
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete implementation, return the number of rows
return 5
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = self.tbView.dequeueReusableCellWithIdentifier("cell", forIndexPath: indexPath)
return cell
}
最后我们运行APP看下效果 (Command+R)

运行APP的效果
嗯,效果实现成功了👋👋👋