可折疊展開的tableView，QQ好友分組列表

demo下載地址https://github.com/zhengwenming/ExpandTableView

 原理分析：這個可以折疊的table，我們點擊的是table的section，每個section下面都對應一個數組，點擊section，就展開sction然后展示數組數據。每次點擊section都要刷新當前點擊的這個section，不用reloadData，提高效率。那么點擊的這個sction怎么知道自己是展開呢還是折疊起來呢？那么關鍵就是對這里的處理，我們自己要加一個條件判斷是展開還是折疊。下面上代碼看看具體實現。

方法一

NSMutableArray *stateArray = [NSMutableArray array];for (int i = 0; i < dataSource.count; i++){    //所有的分區(qū)都是閉合    [stateArray addObject:@"0"];}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{        if ([stateArray[section] isEqualToString:@"1"]){        //如果是展開狀態(tài)    NSArray *array = [dataSource objectAtIndex:section];        return array.count;}else{    //如果是閉合，返回0    return 0;}}
方法一的原理是用一個stateArray去記錄每個section的狀態(tài)，當然光記錄還是不行的，還是不斷的改變這個stateArray對應section的值，展開了就把值替換為1，閉合了替換了0.那么這個0和1就是我們的依據，依據這個就可以返回這個scetion對應的row了。
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];[button setFrame:CGRectMake(0, 0, self.view.frame.size.width, 44)];[button setTag:section+1];button.backgroundColor = [UIColor whiteColor];[button setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];[button setTitleEdgeInsets:UIEdgeInsetsMake(0, 0, 0, 60)];[button addTarget:self action:@selector(buttonPRess:) forControlEvents:UIControlEventTouchUpInside];UIImageView *line = [[UIImageView alloc]initWithFrame:CGRectMake(0, button.frame.size.height-1, button.frame.size.width, 1)];[line setImage:[UIImage imageNamed:@"line_real"]];[button addSubview:line];UIImageView *imgView = [[UIImageView alloc]initWithFrame:CGRectMake(10, (kCell_Height-22)/2, 22, 22)];[imgView setImage:[UIImage imageNamed:@"ico_faq_d"]];[button addSubview:imgView];UIImageView *_imgView = [[UIImageView alloc]initWithFrame:CGRectMake(self.view.frame.size.width-30, (kCell_Height-6)/2, 10, 6)];if ([stateArray[section] isEqualToString:@"0"]) {    _imgView.image = [UIImage imageNamed:@"ico_listdown"];}else if ([stateArray[section] isEqualToString:@"1"]) {    _imgView.image = [UIImage imageNamed:@"ico_listup"];}[button addSubview:_imgView];UILabel *tlabel = [[UILabel alloc]initWithFrame:CGRectMake(45, (kCell_Height-20)/2, 200, 20)];[tlabel setBackgroundColor:[UIColor clearColor]];[tlabel setFont:[UIFont systemFontOfSize:14]];[tlabel setText:sectionArray[section]];[button addSubview:tlabel];return button;}- (void)buttonPress:(UIButton *)sender//headButton點擊{//判斷狀態(tài)值if ([stateArray[sender.tag - 1] isEqualToString:@"1"]){    //修改    [stateArray replaceObjectAtIndex:sender.tag - 1 withObject:@"0"];}else{    [stateArray replaceObjectAtIndex:sender.tag - 1 withObject:@"1"];}[expandTable reloadSections:[NSIndexSet indexSetWithIndex:sender.tag-1] withRowAnimation:UITableViewRowAnimationAutomatic];}
給section中的按鈕添加點擊事件，然后設置按鈕的tag值為section。
方法二
方法二中用一個類去記錄和不斷的替換狀態(tài)，用一個model類。看看這個model類的定義
@interface GroupModel : NSObject@property (nonatomic, assign)BOOL isOpened;@property (nonatomic, retain)NSString *groupName;@property (nonatomic, assign)NSInteger groupCount;@property (nonatomic, retain)NSArray *groupFriends;@end
再看看怎么用
 for (NSDictionary *groupInfoDic in JSONDic[@"group"]) {    GroupModel *model = [[GroupModel alloc]init];    model.groupName = groupInfoDic[@"groupName"];    model.groupCount = [groupInfoDic[@"groupCount"] integerValue];    model.isOpened = NO;    model.groupFriends = groupInfoDic[@"groupArray"];    [dataSource addObject:model];}- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{    return dataSource.count;}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{GroupModel *groupModel = dataSource[section];NSInteger count = groupModel.isOpened?groupModel.groupFriends.count:0;return count;}
(UIView )tableView:(UITableView )tableView viewForHeaderInSection:(NSInteger)section { UIView *sectionView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 44)]; sectionView.backgroundColor = [UIColor colorWithWhite:0.9 alpha:0.8]; GroupModel *groupModel = dataSource[section];
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom]; [button setFrame:sectionView.bounds]; [button setTag:section]; [button setTitleColor:[UIColor grayColor] forState:UIControlStateNormal]; [button setTitle:groupModel.groupName forState:UIControlStateNormal]; [button setTitleEdgeInsets:UIEdgeInsetsMake(0, 0, 0, 60)]; [button addTarget:self action:@selector(buttonPress:) forControlEvents:UIControlEventTouchUpInside]; [sectionView addSubview:button]; UIImageView *line = [[UIImageView alloc]initWithFrame:CGRectMake(0, button.frame.size.height-1, button.frame.size.width, 1)]; [line setImage:[UIImage imageNamed:@”line_real”]]; [sectionView addSubview:line];
UIImageView *imgView = [[UIImageView alloc]initWithFrame:CGRectMake(10, (44-16)/2, 14, 16)]; [imgView setImage:[UIImage imageNamed:@”ico_list”]]; [sectionView addSubview:imgView];
UILabel *numberLabel = [[UILabel alloc]initWithFrame:CGRectMake(self.view.frame.size.width-40, (44-20)/2, 40, 20)]; [numberLabel setBackgroundColor:[UIColor clearColor]]; [numberLabel setFont:[UIFont systemFontOfSize:14]]; NSInteger onLineCount = 0; for (NSDictionary *friendInfoDic in groupModel.groupFriends) { if ([friendInfoDic[@”status”] isEqualToString:@”1”]) { onLineCount++; } } [numberLabel setText:[NSString stringWithFormat:@”%ld/%ld”,onLineCount,groupModel.groupCount]]; [sectionView addSubview:numberLabel];
return sectionView; } - (void)tableView:(UITableView )tableView didSelectRowAtIndexPath:(NSIndexPath )indexPath { GroupModel *groupModel = dataSource[indexPath.section]; NSDictionary *friendInfoDic = groupModel.groupFriends[indexPath.row]; NSLog(@”%@ %@”,friendInfoDic[@”name”],friendInfoDic[@”shuoshuo”]); }
(void)buttonPress:(UIButton *)sender//headButton點擊 { GroupModel *groupModel = dataSource[sender.tag]; groupModel.isOpened = !groupModel.isOpened; [expandTable reloadSections:[NSIndexSet indexSetWithIndex:sender.tag] withRowAnimation:UITableViewRowAnimationAutomatic]; }
看看關鍵代碼，就是按鈕點擊事件里面buttonPress，這一句話 groupModel.isOpened = !groupModel.isOpened; 的意思是如果是展開，那么點擊之后就是折疊， 如果是折疊，點擊之后就是展開。這個狀態(tài)被記錄下來了，而且可以不斷的改變。
好，到此為止。兩種方法介紹完畢。想看demo的同學可以直接到Github上下載https://github.com/zhengwenming/ExpandTableView