UITableView使用实例:创建一个简单的Table View

2009年6月16日 | laifangwen

UITableView - Creating a Simple Table View

UITableView:创建我们的第一个Table View

作者:http://www.iphonesdkarticles.com

原文:http://www.iphonesdkarticles.com/2009/01/uitableview-creating-simple-table-view.html

翻译:http://blog.laifangwen.com

译文地址:http://blog.laifangwen.com/htmldata/iPhone/2009/06/16/220.html

Introduction

说明
In most cases, the requirement is to select an item from the list displayed and then load the details of the selected item in a detail view. UITableView is only responsible for the list of items it displays, the navigation that happens between the list of items and the detail view is handled by the UINavigationController. So the table view always works with the navigation controller and viceversa. This is how the final app looks like:
在开发iPhone应用程序的大多数时候,我们需要展示一个列表,当用户选择其中一个条目时,展示所选条目的详细信息。UITbleView是最适合显示项目列表控件,而UINavigationController控制的导航条则配合列表界面和细节信息界面的切换。所以table view视图总是和导航条控件一并使用,反之亦然。本例最终界面如下:

 

Creating the project

来创建我们的第一个Table View项目
Create a new XCode project by clicking on File -> New Project -> (Under iPhone OS) select "Navigation-Based Application", give it a name and save the project. I have named my project "TableView". The project template "Navigation-Based Application" will give you a navigation controller and a table view tied together, so you do not have to set it up manually.

创建一个新的工程,点击:File -> New Project -> (Under iPhone OS) select "Navigation-Based Application"。取个名字并保存到自己喜欢的位置,我取名为"TableView"。工程的模板"Navigation-Based Application"控件可以自动绑定navigation controller和 table view,所以你不需要自己在设置。


Data Source

数据源
Since we want to display not one or two but a list of items in the table view, we need some kind of a data source to hold our data and something which we can pass it on to the table view so it can use it. This data source can come from anywhere XML Files, Databases, or an array. To learn how to use SQL Lite databases read my SQL Lite tutorial series here. To keep this tutorial simple, I will choose a NSMutableArray as the data source for the table view. You can fill this array from XML files or SQLLite database. The array will be populated with string objects and not custom objects to keep the tutorial less confusing. Read my SQL Lite tutorial series to understand how to use custom objects with the table view.
因为我们需要显示不是一条或者两条数据,而是一个数据条目列表在table view视图,我们需要某种数据源来控制我们的数据同时可以传递给table view视图,这样table view才能为我们发挥效用。数据源可以是XML文件,数据库,或者一个数组。学习如何使用SQL Lite数据库可以阅读我的SQL Lite tutorial series。为保持我们的例子简单而易理解,我选用一个数组即选NSMutableArray作为我们table view的数据源。当然你可以很容易的使用XML文件或者SQLLite数据库替换这个数组作为数据源。为使得例子更容易理解,我们不适用自定义数组对象,仅使用字符串类型的对象作为数组的条目。如果需要使用自定义table view数据源,可以阅读我的SQL Lite tutorial series。


The first thing to do is to build the data source, populate it with the items we need to display in the table view. Let's build our data source in viewDidLoad method of the RootViewController which is called when the view is loaded. This is how the header file and viewDidLoad method in the implementation file looks like

首先,让我们来建立数据源,封装一系列条目,以便我们可以table view里显示。建立我数据源在RootViewController类的viewDidLoad方法里,即在视图加载完后就调用。下面是RootViewController的头文件、实体文件里的viewDidLoad方法的最终代码:

#import <UIKit/UIKit.h>

@interface RootViewController : UITableViewController {

NSMutableArray *listOfItems; //声明一个NSMutableArray类型的变量。
}

@end

//viewDidLoad method declared in RootViewController.m
- (void)viewDidLoad {
[super viewDidLoad];

//Initialize the array. 初始化我们的变量
listOfItems = [[NSMutableArray alloc] init];

//Add items 给我们的变量添加条目
[listOfItems addObject:@"Iceland"];
[listOfItems addObject:@"Greenland"];
[listOfItems addObject:@"Switzerland"];
[listOfItems addObject:@"Norway"];
[listOfItems addObject:@"New Zealand"];
[listOfItems addObject:@"Greece"];
[listOfItems addObject:@"Rome"];
[listOfItems addObject:@"Ireland"];

//Set the title 设置导航条的标题
self.navigationItem.title = @"Countries";
}

//dealloc method declared in RootViewController.m 释放内存
- (void)dealloc {

[listOfItems release];
[super dealloc];
}

 


Array "listOfItems" is declared in RootViewController.h file and is of type NSMutableArray, it is also released in the dealloc method as shown above.
数组变量"listOfItems"在RootViewController.h头文件中声明为NSMutableArray类型,最后在dealloc method中释放。
In viewDidLoad method, we allocate memory and initialize the array and add 8 objects to it. The view of the navigation bar is set to "Countries". Now somehow we need to tell the table view to display the items in the array.
在viewDidLoad method中,我们初始化listOfItems并且添加8个条目,导航条的标题设置为"Countries"。现在我们需要用一种方式来告诉table view来显示我们listOfItems里的条目。


Customize the number of rows in the table view

定义tableview列表的行数
The first thing we have to do is, tell the table view how many rows it should expect and this is done in tableView:numberOfRowsInSection. This method returns an integer which is the number of rows that the table view will display. Since our array consists of 8 objects, we will pass the count message to the array. This is how the code looks like

首先,告诉table view有多少条目需要显示,我们可以用tableView:numberOfRowsInSection方法来定义。该方法将返回table view需要显示条目数的integer数值。在我们的listOfItems有8个对象,我们可以通过给listOfItems发送count消息来返回我们所需的值。实现代码如下:

//RootViewController.m
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return [listOfItems count];
}


Display data in a table cell.

在table cell里显示我们的数据
Now that the table view knows how many rows to display, we need to display the actual text which goes in a table view cell. The table view is made of table rows and rows contains table cell. This is done in tableView:cellForRowAtIndexPath which is called n number of times, where n is the value returned in tableView:numberOfRowsInSection. The method provides indexPath which is of type NSIndexPath and using this we can find out the current row number the table view is going to display. This is how the code looks like

现在,table view已经知道有多少条目需要显示,我们还需要用实际的内容来填充table cell。table view视图由table rows行组成,同时每个table row行包含table cell。填充table cell使用tableView:cellForRowAtIndexPath方法。tableView:cellForRowAtIndexPath将会自动调用n(table可以显示的条目数)次,n为tableView:numberOfRowsInSection的返回值。

//RootViewController.m
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @"Cell";

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];
}

// Set up the cell... 填充cell
NSString *cellValue = [listOfItems objectAtIndex:indexPath.row];
cell.text = cellValue;

return cell;
}


In the code above, we first initialize the cell if required. Then get the string from the array, by passing objectAtIndex method to the receiver, with the current row number. The "cellValue" is then set to the text of the cell and the cell is returned. Run your application to see the eight rows in the UITableView.
在上面代码中,我们首先根据需要初始化cell。然后从数组listOfItems中通过objectAtIndex方法获取数组(table)当前行数为索引的数组条目值并存储在cellVallue变量中。cellValue变量传递给cell的实体text,并用return cell返回给cell实体。运行程序,可以在UITableView里看到8行数据。


Conclusion

结论
UITableView really makes it easy to display list of items, by configuring few simple methods. I hope this tutorial helped you in getting started. I know this tutorial is really simple but this way I really get to concentrate on one problem at a time. In my next tutorial,I will show you how to load a detail view and pass data to it.

UITableView视图是实现条目列表最简单的方式,你只需配置少量简单的方法。希望通过这个简单的例子可以帮助你理解UITableView的作用。这个例子是在简单不过的例子了,但这样的例子可以使我们一次只专注于解决一个问题。在下一篇教程中,我将展示如何加载一个细节视图并且如何传递数据给它。

翻译:http://blog.laifangwen.com   译文地址:http://blog.laifangwen.com/htmldata/iPhone/2009/06/16/220.html

Happy Programming,iPhone SDK Articles 。http://www.iphonesdkarticles.com/2009/01/uitableview-creating-simple-table-view.html

原创翻译,欢迎转载,但需保留作者信息和翻译者信息,谢谢!

 本例UITableView源码下载:

TableViewPart1.zip

 

Tags: UITableView  iPhone  实例  object-c  
相关文章:
引用通告地址: http://blog.laifangwen.com/cmd.asp?act=gettburl&id=220

评论: 0 | 引用: 0 | 浏览:
名称(*):
邮箱:
网站链接:
正文(*):
选 项:
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。