UITableView實現分組, 並且點擊每個分組后展開

效果圖:

簡單說下實現思路:

數據傳過來之后, 先創建好對應個數的分組頭部View, 也就是要在

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section

在這個方法返回的視圖...我這里用的UIButton, 然后監聽UIButton的點擊, 然后重新刷新這一組

根據UIButton的selected狀態來判斷是否要展開, 如果是展開, 就返回該組對應的行數, 反之就返回0行就可以了

 

代碼部分:

.h文件

#import <UIKit/UIKit.h>

@interface RPCategoryListController : UITableViewController

// 分組模型數據
@property (nonatomic, strong) NSArray *category;

@end

 

.m文件

#import "RPCategoryListController.h"
#import "RPCategoryModel.h"
#import "RPChildCategoryModel.h"

#define RPSectionTitleHeight 35

@interface RPCategoryListController ()

@property (nonatomic, strong) NSMutableArray *sectionTitleBtns;

@end

@implementation RPCategoryListController

static NSString * const reuseIdentifier_category = @"Category";

#pragma mark - 懶加載

- (NSMutableArray *)sectionTitleBtns
{
    if (!_sectionTitleBtns) {
        _sectionTitleBtns = [[NSMutableArray alloc] init];
    }
    return _sectionTitleBtns;
}

#pragma mark - 系統方法

- (instancetype)init
{
    return [super initWithStyle:UITableViewStyleGrouped];
}

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    [self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:reuseIdentifier_category];
}

#pragma mark - Table view data source

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return self.category.count;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    UIButton *sectionTitleBtn;
    
    // 獲取被點擊的組標題按鈕
    for (UIButton *btn in self.sectionTitleBtns) {
        if (btn.tag == section) {
            sectionTitleBtn = btn;
            break;
        }
    }
    
    // 判斷是否展開
    if (sectionTitleBtn.isSelected) {
        RPCategoryModel *categoryModel = self.category[section];
        return categoryModel.childs.count;
    }
    return 0;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    RPChildCategoryModel *childCategoryModel = [self.category[indexPath.section] childs][indexPath.row];
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseIdentifier_category forIndexPath:indexPath];
    cell.textLabel.textColor = RPFontColor;
    
    if ([[RPInternationalControl userLanguage] isEqualToString:@"en"]) {
        cell.textLabel.text = childCategoryModel.ename;
    } else {
        cell.textLabel.text = childCategoryModel.name;
    }
    return cell;
}

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    return self.sectionTitleBtns[section];
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return RPSectionTitleHeight;
}

- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
    return 5;
}

#pragma mark - 私有方法

- (void)sectionTitleBtnClick:(UIButton *)sectionTitleBtn
{
    // 修改組標題按鈕的狀態
    sectionTitleBtn.selected = !sectionTitleBtn.isSelected;
    
    // 刷新單獨一組
    NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:sectionTitleBtn.tag];
    [self.tableView reloadSections:indexSet withRowAnimation:UITableViewRowAnimationAutomatic];
}

- (void)setCategory:(NSArray *)category
{
    _category = category;
    
    for (int index = 0; index < category.count; index++) {
        
        // 組標題按鈕的標題
        NSString *title = self.category[index] name;
        
        // 創建組標題按鈕
        UIButton *sectionTitleBtn = [UIButton buttonWithType:UIButtonTypeCustom];
        sectionTitleBtn.frame = CGRectMake(0, 0, RP_SCREEN_WIDTH, RPSectionTitleHeight);
        sectionTitleBtn.tag = index;
        sectionTitleBtn.titleLabel.font = [UIFont systemFontOfSize:13.f];
        [sectionTitleBtn setTitle:title forState:UIControlStateNormal];
        [sectionTitleBtn setTitleColor:RPFontColor forState:UIControlStateNormal];
        [sectionTitleBtn setBackgroundColor:[UIColor whiteColor]];
        [sectionTitleBtn addTarget:self action:@selector(sectionTitleBtnClick:) forControlEvents:UIControlEventTouchUpInside];
        [self.sectionTitleBtns addObject:sectionTitleBtn];
        
        // 組標題按鈕底部分隔線
        UIView *bottomLine = [[UIView alloc] initWithFrame:CGRectMake(0, sectionTitleBtn.height - 1, sectionTitleBtn.width, 1)];
        bottomLine.backgroundColor = RPNavBarColor;
        bottomLine.alpha = 0.2;
        [sectionTitleBtn addSubview:bottomLine];
    }
}

關鍵代碼:

NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:sectionTitleBtn.tag];
[self.tableView reloadSections:indexSet withRowAnimation:UITableViewRowAnimationAutomatic];