iOS TableView实现QQ好友列表（三）

上节我们讲到如何展示好友信息

iOS TableView实现QQ好友列表（二）

http://blog.youkuaiyun.com/lwjok2007/article/details/46549111

接下来我们将分组点击的时候折叠起来。

首先新建一个可变字典用来存储当前列表是否展示

[objc]  view plain copy

1. NSMutableArray *selectedArr;//控制列表是否被打开  

[objc]  view plain copy

1. selectedArr=[[NSMutableArray alloc]init];  

根据前两节所讲，我们讲分组名称放在section的header上了，但是Header 不像cell一样有点击方法

此时我们可以考虑给header上添加一个button来实现点击的时候打开列表和关闭列表

[objc]  view plain copy

1. -(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section  
2. {  
3.     UIView *view=[[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 30)];  
4.     view.backgroundColor=[UIColor whiteColor];  
5.       
6.     UILabel *titleLabel=[[UILabel alloc]initWithFrame:CGRectMake(30, 5, SCREEN_WIDTH, 30)];  
7.     titleLabel.text=[titleArray objectAtIndex:section];  
8.     [view addSubview:titleLabel];  
9.       
10.     UIImageView *imageView=[[UIImageView alloc]initWithFrame:CGRectMake(5, 5, 20, 20)];  
11.     imageView.tag=20000+section;  
12.       
13.     imageView.image=[UIImage imageNamed:@"arrow_down.png"];  
14.     [view addSubview:imageView];  
15.       
16.     //添加一个button 用来监听点击分组，实现分组的展开关闭。  
17.     UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];  
18.     btn.frame=CGRectMake(0, 0, SCREEN_WIDTH, 50);  
19.     btn.tag=10000+section;  
20.     [btn addTarget:self action:@selector(btnOpenList:) forControlEvents:UIControlEventTouchDown];  
21.       
22.       
23.     return view;  
24. }  

此处设置button的tag为10000+section  是为了 保证通过button 的 tag 识别出当前点击的是哪个分组（没有直接设置成section 而是设置为10000+section  是为了保证左侧的图片也能通过tag确定是哪个分组的，所以他的tag被设置为 20000+section  这样就保证了 section不超过10000的时候两个都可以通过tag确定，而且不相互影响）

实现刚才添加的button的方法 

[objc]  view plain copy

1. -(void)btnOpenList:(UIButton *)sender  
2. {  
3.     NSString *string = [NSString stringWithFormat:@"%d",sender.tag-10000];  
4.       
5.     //数组selectedArr里面存的数据和表头想对应，方便以后做比较  
6.     if ([selectedArr containsObject:string])  
7.     {  
8.         [selectedArr removeObject:string];  
9.     }  
10.     else  
11.     {  
12.         [selectedArr addObject:string];  
13.     }  
14.       
15.     [tableViewList reloadData];  
16. }  

上边的方法是在点击了分组之后跟新一下 selectedArr数组，

下来我们就实现table跟新的时候  读取selectedArr 决定是否展开分组

[objc]  view plain copy

1. -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath  
2. {  
3.     NSString *indexStr = [NSString stringWithFormat:@"%d",indexPath.section];  
4.   
5.     NSString *str=[titleArray objectAtIndex:indexPath.section];  
6.       
7.     NSArray *arr=[dataDic objectForKey:str];  
8.       
9.     static NSString *CellIdentifier = @"UserCell";  
10.       
11.     UserTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];  
12.     cell=nil;  
13.     if (cell == nil) {  
14.         cell = [[UserTableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];  
15.           
16.         cell.selectionStyle = UITableViewCellSelectionStyleGray;  
17.     }  
18.       
19.     //只需要给当前分组展开的section 添加用户信息即可  
20.     if ([selectedArr containsObject:indexStr]) {  
21.         NSDictionary *dic=[arr objectAtIndex:indexPath.row];  
22.         cell.headerphoto.image=[UIImage imageNamed:[dic valueForKey:@"usericon"]];  
23.         cell.nameLabel.text=[dic valueForKey:@"name"];  
24.         cell.isOnLine.text=@"[在线]";  
25.         cell.introductionLabel.text=@"无动态";  
26.         cell.networkLabel.text=@"4G";  
27.     }  
28.       
29.       
30.     return cell;  
31.       
32. }  

到此位置 展开关闭可以了 但是左侧的剪头还没有变换过来（展开的时候为向下的剪头，关闭时为朝右的剪头）

此时 我们需要调整方法

[objc]  view plain copy

1. -(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section  
2. {  
3.     UIView *view=[[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 30)];  
4.     view.backgroundColor=[UIColor whiteColor];  
5.       
6.     UILabel *titleLabel=[[UILabel alloc]initWithFrame:CGRectMake(30, 5, SCREEN_WIDTH, 30)];  
7.     titleLabel.text=[titleArray objectAtIndex:section];  
8.     [view addSubview:titleLabel];  
9.       
10.     UIImageView *imageView=[[UIImageView alloc]initWithFrame:CGRectMake(5, 5, 20, 20)];  
11.     imageView.tag=20000+section;  
12.     //更具当前是否展开设置图片  
13.     NSString *string = [NSString stringWithFormat:@"%d",section];  
14.     if ([selectedArr containsObject:string]) {  
15.         imageView.image=[UIImage imageNamed:@"arrow_down.png"];  
16.     }else{  
17.           
18.         imageView.image=[UIImage imageNamed:@"arrow_right.png"];  
19.     }  
20.     [view addSubview:imageView];  
21.       
22.     //添加一个button 用来监听点击分组，实现分组的展开关闭。  
23.     UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];  
24.     btn.frame=CGRectMake(0, 0, SCREEN_WIDTH, 50);  
25.     btn.tag=10000+section;  
26.     [btn addTarget:self action:@selector(btnOpenList:) forControlEvents:UIControlEventTouchDown];  
27.     [view addSubview:btn];  
28.       
29.     return view;  
30. }  

最终效果如下

到此为止基本上完成了 模仿qq好友列表的简单功能。

源代码将上传到qq群空间

苹果开发群 ：414319235  欢迎加入  欢迎讨论问题

版权声明：本文为博主原创文章，未经博主允许不得转载。