TableViewController_01

http://www.cnblogs.com/liufan9/archive/2012/06/01/2528714.html

在很多iOS应用中都有UITableView控件的身影。让我们的系列教程也从UITableView开始吧。

目标

任何一个伟大的iOS应用都源自一个伟大的构想。虽然我们只是再做演练，但演练也同样需要一个伟大的构想！这样我们会产生更加浓烈的兴趣，目标更加明确，同时不会纠结于具体的细节之中。

提示：细节是在不断重复中逐渐掌握的，过早的进入细节很容易让人迷失方向。

现在用微博的人越来越多，假设我们需要一个管理“微博关注人”的列表这么一个应用，能够帮助我维护微博关注人的信息。怎么样？对于一个iOS初学者，这么一个假设应该已经足够大了吧。:]

那么我们就开始动手吧。 

一. 创建应用

创建应用的方法，可以参见前两天写的：第一个iOS应用——Hello world!，在此不再累述，创建应用时用“My Focus”做为产品名称。如下图所示：

二. 增加表格控件

1. 打开“MainStoryboard.storyboard”文件；

2. 因为要做一个表格应用，而默认的Storyboard是一个视图应用，先点击“View Controller”，把它删除，如下图所示：

删除之后，我们会发现一片空白，如下图所示：

3. 添加表格视图控件——从右侧的“工具区域”找到Table View Controller控件，拖到StoryBoard的空白区域放手；

4. 点击“Table View Controller”左侧的折叠标记依次展开选中“Table View Cell”，然后在属性区的“Identifier”输入：“userInfoCell”,如下图所示：

OK，我们运行一下，看看刚才比划了这几下实现了哪些效果：

一个空的表格跃然屏幕之上，而且试着用手拽拽，表格都会随着手势上下滚动了。到目前为止，我们还没有写一句代码，不错吧。:]

三. 编码前的准备

在写程序之前，我们需要做一些简单的准备工作。

要写代码，需要有写的“位置”，在iOS开发中，大多情况能够“写”的位置有两个。

1. “.h”文件——头文件，用于声明对象的属性，方法等；

2. “.m”文件——对象实现文件，用于对象的具体实现。

好，我们先记住这两个，其他用不到的，我们不妨先假设我们已经会了，这样我们会有一个强大的内心，专注去做现在要做的事情。:]

让我们简单回想一下第二部分中，我们做的事情：打开“MainStoryboard”->删除了默认的“View Controller”->增加一个“Table View Controller”，因为我们要做的是一个表格应用。

既然要做的是一个表格应用，那么我们需要一个表格的实现对象，先看下导航区域的内容，如下图：

可以看到两个文件，从名字上看，一个是View Controller的头文件，一个是View Controller的实现文件，这两个文件显然也不是我们需要的，删除掉！

接下来按照以下步骤操作：

1. 在GUI上点鼠标右键，在弹出菜单中选择“New File...”，在弹出窗口中选择“Cocoa Touch”“Objective-C class”，点击“Next”按钮，见下图：

2. 在下一个的窗口中，在“Class”中输入“JOYTableViewController”，“Subclass of”中通过下拉列表选择或者输入“UITableViewController”，同时不要选择下面两个复选框，然后点击“Next”，见下图：

3. 在下一个窗口，直接点击“Create”按钮创建对象。现在的导航区域应该如下图显示：

通过以上三步操作，Xcode帮助我们准备好了头文件和实现文件。

在写代码之前，还需要做一件非常重要的事情——告诉Storyboard，它的要用按照新增加对象中的代码执行动作。

1. 打开“MainStoryboard.storyboard”；

2. 点击选中“Table View Controller”；

3. 点击工具区域的“Show the Identity Inspector”按钮，显示“标示检查器”；

4. 在“Class”中，点击下拉按钮，选择我们刚刚创建的类“JOYTableViewController”。

见下图：

好，通过简单的几步准备，接下来我们要进入具体的实做阶段，激动吗？:]

四. 通过代码填充表格

点击“导航区域”的“JOYTableViewController.m”打开它。

说明：本次演练中，所有的编码都只在这一个文件中。

小技巧：此时你按一下option + command + 0这个组合键，可以关闭“工具区域”这样可以使“编辑区域”看起来更大些。

代码开始部分有一个 @interface JOYTableViewController，我们可以把对象的私有属性和方法在此定义，而不必在 .h 文件中进行定义，这个特性可以保证你开放的接口更加的清晰简洁。

1. 定义一个数组，用于存放显示关注人信息，代码如下：

1 @interface JOYTableViewController () {2 @private3     NSArray *_userList;4 }5 6 @end

提示：不要忘记大括号啊。

2. 填充数组内容，找到viewDidLoad方法，在方法的末尾添加一句：

1 _userList = [[NSArray alloc]initWithObjects:@"爱Apps", @"苹果汇", @"数码iPhone大百科",2                  @"新浪视野", @"李开复", nil];

假设我只关注了这五个人。

3. 修改表格区段数，找到numberOfSectionsInTableView方法，将其中的“return 0”，改为“return 1”，如下所示：

1 - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView2 {3     return 1;4 }

有关区段的内容，会在下一篇文章中阐述，现在我们假设表格只有一个区段。

4. 修改表格行数，找到

1 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

方法，将其中的return 0，改为：

1 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section2 {3     return [_userList count];4 }

说明：这句话的意思是“返回 [用户列表 数量]”，Objective-C的语法有点像自然语言，大家先记住以往我们熟悉的“.”被现在的“空格”和“中括号”替代了。

预告：计划在TableView的演练专题结束后，写一篇介绍Objective-C的基础语法，尽请期待。:]

5. 在单元格中依次显示数组内容，找到 

1 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

方法，在最后的“return cell”语句前添加如下代码：

1     // 实例化单元格对象2     if (cell == nil) {3         cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];4     }5     6     // 设置单元格文本7     [cell.textLabel setText:[_userList objectAtIndex:[indexPath row]]];

6. 运行看看效果，见下图:]

五. 小结

本次演练我们先暂时告一段落，到目前为止，我们已经创建了一个最简单的表格应用。虽然看起来还很粗糙，但是我们已经迈出了坚实的一步。:]

本演练源程序下载地址：JoyiOSMyFocus1.zip

下一篇文章我们会演练如何通过数据文件加载表格内容，同时在表格中显示图片等内容。敬请期待。:]