iOS UITableView 使用详解

2015-07-26

概述

在iOS开发中UITableView是使用的最广泛的控件，基本上每一个项目都会有多个地方会用到。它的作用是列表显示相关的内容。UITableView继承自UIScrollView,由于内部使用了缓存池机制，因此性能相当好。UITableView中每行数据都是一个UITableViewCell，为了方便开发者的使用，在UITableViewCell中内置了许多样式，在使用的时候非常方便。

##样式
UITableView有两种风格：UITableViewStylePlain 和 UITableViewStyleGrouped。这两者操作起来其实并没有本质区别，只是后者按分组样式显示前者按照普通样式显示而已。

列表样式.png
Plain样式

分组样式.png
Group样式

##数据源
UITableView需要设置一个数据源(DataSource)来显示数据，UITableView会向数据源查询一共有多少行数据以及每⼀行显示什么数据。没有设置数据源的UITableView会显示空的UITableView。在iOS中，如果一个OC对象遵守UITableViewDataSource协议,就可以作为UITableView的数据源。以下是UITableView数据源的相关方法。

// 返回分组数 
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView; 

// 返回每组行数 
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;

// 返回每行的单元格 
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath; 

// 返回每组头标题
-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section; 

// 返回每组尾部标题
-(NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section; 

// 返回 Cell 是否在滑动时是否可以编辑
-(BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath; 

// 返回 Cell 是否可以移动
-(BOOL)tableView:(UITableView *)tableView canMoveRowAtIndexPath:(NSIndexPath *)indexPath; 

// TableView 右侧建立一个索引表需要的数组内容 
-(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView; 

// 对 Cell 编辑结束后的回调
-(void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath;

// 对 Cell 移动结束后的回调
-(void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath;

##代理
UITableView可以设置一个代理（Delegate），UITableViewDelegate不像UITableViewDataSource的作用是主要提供数据，UITableViewDelegate有许多代理方法，这些代理方法的作用也多种多样，比如：改变UITableView的相关样式，监听单元格显示周期、监听单元格选择编辑操作、设置是否高亮显示单元格、设置行高等。

// Cell 即将显示，可用于自定义 Cell 显示的动画效果
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath;

// UITableView 的 HeaderView 即将显示，可用于自定义 HeaderView 显示的动画效果
-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section;

// UITableView 的 FooterView 即将显示，可用于自定义 FooterView 显示的动画效果
-(void)tableView:(UITableView *)tableView willDisplayFooterView:(UIView *)view forSection:(NSInteger)section;

// Cell 完成显示
-(void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath*)indexPath;

// HeaderView 完成显示
-(void)tableView:(UITableView *)tableView didEndDisplayingHeaderView:(UIView *)view forSection:(NSInteger)section NS_AVAILABLE_IOS(6_0);

// FooterView 完成显示
-(void)tableView:(UITableView *)tableView didEndDisplayingFooterView:(UIView *)view forSection:(NSInteger)section;

##UITableViewCell
UITableViewCell是构建一个UITableView的基础，在UITableViewCell内部有一个UIView控件作为其他内容的容器，它上面有一个UIImageView和两个UILabel，通过UITableViewCellStyle属性可以对其样式进行控制。UITableViewCell有四种样式可选：

// 简单包含一个可选的imageView和一个label显示文本
UITableViewCellStyleDefault
// 包含可选的imageView，一个textLabel和一个detailLabel，其中detailLabel位置在最左，右对齐，文本颜色为蓝色
UITableViewCellStyleValue1
//包含一个textLabel和一个detailLabel，textLabel默认为蓝色文本，右对齐，detailLabel的位置紧挨着textLabel右边，默认文本左对齐，颜色为黑色
UITableViewCellStyleValue2   
// 包含可选的imageView，一个textLabel，一个detailLabel，其中detailLabel在textLabel下方，字体较小，默认颜色为黑色，左对齐
UITableViewCellStyleSubtitle

UITableViewCell右侧的accessoryView可以显示不同的图标，在iOS中称之为访问器，点击可以触发不同的事件，可以通过UITableViewCellAccessoryType来设置。

typedef NS_ENUM(NSInteger, UITableViewCellAccessoryType) {
 UITableViewCellAccessoryNone,                       // 不显示任何图标
 UITableViewCellAccessoryDisclosureIndicator,    // 跳转指示图标
 UITableViewCellAccessoryDetailDisclosureButton, // 内容详情图标和跳转指示图标
 UITableViewCellAccessoryCheckmark,              // 勾选图标
 UITableViewCellAccessoryDetailButton             // 内容详情图标
};

如果用户不断滚动UITableView的单元格，如果我们不复用之前的单元格，那么用户在反复上下滚动的时候，内存就会不断飙升，特别是当内容无穷尽的时候，会到应用的闪退。当然为了实现UITableViewCell的重用，我们并不需要做太多。因为在UITableView内部有一个缓存池，初始化时使用initWithStyle:(UITableViewCellStyle) reuseIdentifier:(NSString *)方法指定一个可重用标识，就可以将这个cell放到缓存池，我们优先在缓存之中查找，如果没找到则创建，这样有效地复用，防止内存飙升。

static NSString * const  MainCityTableViewCellID = @"MainCityTableViewCellID";

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    // 在缓存池里查找
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:MainCityTableViewCellID];
    // 未找到则创建
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:MainCityTableViewCellID];
    }
    cell.accessoryType = UITableViewCellAccessoryCheckmark;
    cell.textLabel.text = @"100";
    return cell;
}

##编辑

1、删除操作

UITableView的编辑模式可以使UITableViewCell上出现删除按钮，通过代理方法进行对点击事件进行监听处理逻辑。

开启编辑模式，此时对应的UITableViewCell上会出现对应的绿色添加按钮和红色删除按钮

1	[self.tableView setEditing:!self.tableView.editing animated:YES];

设置UITableView编辑模式的类型

-(UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
	return UITableViewCellEditingStyleDelete;
}

当点击出现的Delete按钮时，会调用下面这个方法，所以在这个方法里面可以实现进行删除操作的一些逻辑

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if(editingStyle == UITableViewCellEditingStyleDelete) {
    		// 删除并更新数据
    }
}

划动UITableViewCell是否出现Delete按钮

- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath 
{
    return YES;
}

修改Delete这个按钮的文本，可以实现下面的代理方法

- (NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath 
{ 
	return @"Delete"; 
}

2、添加操作

UITableView的编辑模式可以使UITableViewCell上出现添加按钮，通过代理方法进行对点击事件进行监听处理逻辑。

开启编辑模式，此时对应的UITableViewCell上会出现对应的绿色添加按钮和红色删除按钮

1	[self.tableView setEditing:!self.tableView.editing animated:YES];

设置UITableView编辑模式的类型

-(UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
	return UITableViewCellEditingStyleInsert;
}

点击添加按钮时，会调用下面这个方法，所以在这个方法里面可以实现进行添加操作的一些逻辑

- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if(editingStyle == UITableViewCellEditingStyleInsert) {
    		// 添加并更新数据
    }
}

3、移动操作

UITableView自身就有相关的接口实现UITableViewCell的移动。在需要移动的时候，我们只需要调用[tableView setEditing:YES animated:YES]进入编辑模式，然后实现相关的代理方法，就可以实现UITableViewCell的移动。

设置UITableView编辑模式的类型,默认编辑模式下，每个cell左边有个红色的删除按钮，设置为None即可去掉

- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return UITableViewCellEditingStyleNone;
}

设置UITableView的Cell支持移动操作

- (BOOL)tableView:(UITableView *)tableView canMoveRowAtIndexPath:(NSIndexPath *)indexPath
{
    return YES;
}

当UITableViewCell移动完成后更新数据，刷新UITableView视图

- (void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath
{
    //更新数据源
}