iOS编程教程（四）：创建一个简单的表视图

创建Hello World应用程序有乐趣吗？在本教程中，我们将继续创建更复杂的东西，并使用表视图构建一个简单的应用程序，。如果你没有看过以前的iOS编程的基本教程，在继续接下来的教程之前先看看把。

首先，在iPhone应用程序什么是表视图中？表视图是一种常见的UI元素在iOS应用程序。在某些方面，大多数应用程序，使用表视图去显示数据列表。最好的例子是内置的手机应用程序。您的联系人显示在表视图中的。另一个例子是邮件程序。它使用表视图来显示你的信箱和电子邮件。，表视图不仅被设计去显示文本数据，也允许您数据在图像中显示。内置的视频和YouTube应用程序都是很好的例子。

使用表视图的应用程序示例

“创建SimpleTable项目”

有了表视图的简单理解，让我们开始着手创建一个简单的应用程序。如果你是认真学习的iOS编程就不要只翻阅文章。打开你的Xcode和代码！这是最好的方式来研究编程。

启动Xcode，创建一个新的项目“Single View application（单一视图的应用程序）”。

Xcode项目模板选择

点击“Next（下一步）”继续。再次，填写所需的所有选项的Xcode项目：

· Product Name（产品名称）：SimpleTable-这是您的应用程序的名称。

· Company Identifier（公司标识）：com.appcoda -它实际上是域名反写。如果你有一个域，您可以使用您自己的域名。否则，你可能会使用我们的，或者只需填写在“edu.self”。

· Class Prefix（类前缀）：SimpleTable - Xcode使用的类的前缀自动命名类。以后，你可以选择自己的前缀，甚至留空白。但在本教程中，让我们保持简单，使用“SimpleTable”好了。

· Device Family（设备系列）：iPhone -使用“iPhone”这个项目。

· Use Storyboards（使用故事板）： [unchecked] -不要选择此选项。这个简单的项目我们不需要故事板。

· Use Automatic Reference Counting（使用自动的引用计数）：[checked]-默认情况下，这应该被启用。不用管他。

· Include Unit Tests（包括单元测试）：[unchecked] -不要选中此复选框。现在，你不需要单元测试类。

SimpleTable项目选项

点击“Next（下一步）”继续。Xcode然后问你在哪里保存 “SimpleTable”的项目。选择任何文件夹（例如桌面）来您的项目。并且，取消Source Control（源代码管理）选项。单击“Create（创建）”继续。

选择一个文件夹来保存你的项目

当你确认，Xcode根据您所提供的选项自动创建“SimpleTable的”项目。结果屏幕看起来像这样：

主屏的SimpleTable项目的

设计视图

首先，我们将创建用户界面和添加表视图。选择“SimpleTableViewController.xib”切换到界面生成器。

Interface Builder中SimpleTable项目

在对象库中，选择“Table View（表视图）”对象，并将其拖动到视图中。

插入“表视图”后您的屏幕应该像下面这样。

第一时间运行你的程序

在继续之前，请尝试使用模拟器来运行你的应用程序。单击“Run（运行）”按钮来建立你的应用程序并测试它。

模拟器的屏幕上会看起来像这样：

很简单，对不对？你已经在你的应用程序添加表视图了。但就目前而言，它不包含任何数据。接下来，我们将编写一些代码，来添加数据到表中。

添加表数据

回到Project Navigator（项目导航器）中，选择“SimpleTableViewController.h”。 “UIViewController”后添加“<UITableViewDelegate, UITableViewDataSource>”。你的代码应该象下面这样：

1
2
3
4
5

#import <UIKit/UIKit.h>

@interface SimpleTableViewController : UIViewController <UITableViewDelegate, UITableViewDataSource>

@end

在Objective-C ，“UITableViewDelegate”和“UITableViewDataSource”被称为协议。基本上，为了在表视图中显示数据，我们必须遵循协议规定的要求，并实现所有强制性方法。

UITableViewDelegate和UITableViewDataSource

此前，我们已经在头文件中添加了“UITableViewDelegate”和“UITableViewDataSource”协议，。这可能会有点混乱。他们是干什么的呢？

在表视图后的实际类UITableView，，被设计成灵活处理各种不同类型的数据。您可能会显示一个列表的国家或联系人的姓名。或者像这个例子，我们将使用表视图呈现食谱列表。那么，你如何告诉UITableView的列表中要显示的数据呢？UITableViewDataSource就是答案。这是您的数据和表视图之间的链接。UITableViewDataSource协议声明了两个你必须实现的方法(tableView:cellForRowAtIndexPath and tableView:numberOfRowsInSection)，。通过实施这些方法，你告诉表视图中显示多少行，和每行中的数据。

另一方面，UITableViewDelegate，涉及到UITableView的外观。协议的可选方法，让你管理表里单个行的高度，配置表头和表尾，重新排序表格单元格。在这个例子中我们不改写这些方法。让我们把他们留在未来的教程把。

接着，选择“SimpleTableViewController.m”，并定义一个实例变量的表中的数据。

1
2
3
4

@implementation SimpleTableViewController
{
NSArray *tableData;
}

在方法view DidLoad中，添加以下代码，来初始化”tableData“数组。我们用食谱列表来初始化数组。

1
2
3
4
5
6

- (void)viewDidLoad
{
   [super viewDidLoad];
   // Initialize table data
    tableData = [NSArray arrayWithObjects:@"Egg Benedict", @"Mushroom Risotto", @"Full Breakfast", @"Hamburger", @"Ham and Egg Sandwich", @"Creme Brelee", @"White Chocolate Donut", @"Starbucks Coffee", @"Vegetable Curry", @"Instant Noodle with Egg", @"Noodle with BBQ Pork", @"Japanese Noodle with Pork", @"Green Tea", @"Thai Shrimp Cake", @"Angry Birds Cake", @"Ham and Cheese Panini", nil];
}

什么是数组？

数组是一种计算机编程里的基本数据结构。你可以把一个数组作为数据元素的集合。回到上述代码中的数组tableData在，它代表文本元素的集合。您可以把数组想像成这样：

数组元素中的每一个都能被识别或通过索引来访问。具有10个元素的数组，将具有从0到9的目录。这意味着，tableData [0]返回的“tableData”数组的第一个元素。

在Objective C，NSArray是用于创建和管理数组的类。您可以使用NSArray创建大小固定的静态数组。如果你需要一个动态数组，可以使用NSMutableArray。

NSArray提供工厂方法来创建一个数组对象。在我们的代码中，我们使用“arrayWithObjects”来实例化一个NSArray对象，并预载特定元素（如汉堡包）。

您还可以使用内置的方法来查询和管理数组。之后，我们将调用“count”的方法来查询数组中的数据元素数量。要了解更多有关NSArray的使用方法，你可以经常参考苹果的官方文件。

最后，我们必须添加两个数据源方法：“tableView：numberOfRowsInSection”和“tableView：cellForRowAtIndexPath”。这两种方法都是UITableViewDataSource协议的一部分。配置一个UITableView时，这是必须实现的方法。第一种方法是告知一个表视图页面中有多少行。因此，让我们添加下面的代码。“count”的方法只是简单返回在“tableData”数组的项目数。

1
2
3
4

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return [tableData count];
}

下一步，我们实现所需的其他方法。

1
2
3
4
5
6
7
8
9
10
11
12
13

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
   static NSString *simpleTableIdentifier = @"SimpleTableItem";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:simpleTableIdentifier];

   if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:simpleTableIdentifier];
   }

    cell.textLabel.text = [tableData objectAtIndex:indexPath.row];
   return cell;
}