UITableView实现分组, 并且点击每个分组后展开

Posted 2020-06-18 Rinpe

效果图:

简单说下实现思路:

数据传过来之后, 先创建好对应个数的分组头部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];