天天看点

实现类似QQ的折叠效果

//  主要核心是点击自定义header来展开和收起每一组里面的cell,模型里面应该有isShow此属性来记录开展还是收起。

//  ViewController.m

//  实现类似QQ的折叠效果

//

//  Created by skg_Myfly on 16/3/3.

//  Copyright © 2016年 skg_Myfly. All rights reserved.

//

#import "ViewController.h"

#import "QQCellModel.h"

@interface ViewController ()<UITableViewDataSource,UITableViewDelegate>

/** tableview */

@property (nonatomic , strong ) UITableView *tableView;

/** 全局数据源 */

@property (nonatomic , strong ) NSMutableArray *dateArray;

@end

@implementation ViewController

//懒加载

-(NSMutableArray *)dateArray{

    if (!_dateArray) {

        self.dateArray = [NSMutableArray array];

    }

    return _dateArray;

}

- (void)viewDidLoad {

    [super viewDidLoad];

    //添加数据

    for (int i = \'A\';  i <= \'Z\'; i ++) {

        QQCellModel* model =   [[QQCellModel alloc] init];

        model.name =  [NSString stringWithFormat:@"%c",i];

//        model.isShow = YES;

        for (int j = 0;  j < 10; j ++) {

            [model.array addObject: [NSString stringWithFormat:@"%c - %d",i,j]];

        }

        [self.dateArray addObject:model];

    }

//实例化表单

    _tableView =  [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStyleGrouped];

    _tableView.delegate = self;

    _tableView.dataSource = self;

    _tableView.rowHeight = 50;

    [self.view addSubview:_tableView];

}

//合计多少组

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{

    return  [_dateArray count];

}

//每组里面含多少行

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{

    QQCellModel* model =  [_dateArray objectAtIndex:section];

    if (model.isShow) {

        return  model.array.count;

    }else{

        return 0;

    }

}

//添加每行显示的内容

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    static NSString* ID = @"Cell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID ];

    if (!cell) {

        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:ID];

    }

    QQCellModel* model =  [_dateArray objectAtIndex:indexPath.section];

    NSString* str =  [[model array] objectAtIndex:indexPath.row];

    cell.textLabel.text = str;

    return cell;

}

// 定义头标题的视图,添加点击事件

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

    QQCellModel* model =  [_dateArray objectAtIndex:section];

    UIButton* btn =[UIButton buttonWithType:UIButtonTypeCustom];

    btn.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 50);

    [btn setTitle:model.name forState:UIControlStateNormal];

    btn.tag = section;

    [btn addTarget:self action:@selector(btnClick:with:) forControlEvents:UIControlEventTouchUpInside];

    if (section % 2) {

        btn.backgroundColor =  [UIColor darkGrayColor];

    }else{

        btn.backgroundColor =  [UIColor lightGrayColor];

    }

    return btn;

}

//点击后事件相应

-(void)btnClick:(UIButton*)btn with:(NSInteger*)section{

    QQCellModel* model =  [_dateArray objectAtIndex:btn.tag];

    if ([model isShow]) {

        [model setIsShow:NO];

    }else{

        [model setIsShow:YES];

    }

    [_tableView reloadSections:[NSIndexSet indexSetWithIndex:btn.tag] withRowAnimation:UITableViewRowAnimationFade];

//    [_tableView reloadRowsAtIndexPaths:<#(nonnull NSArray<NSIndexPath *> *)#> withRowAnimation:<#(UITableViewRowAnimation)#>]

}

@end

-------------------------------------------------------------------------------------------

//

//  QQCellModel.h

//  实现类似QQ的折叠效果

//

//  Created by skg_Myfly on 16/3/3.

//  Copyright © 2016年 skg_Myfly. All rights reserved.

//

#import <Foundation/Foundation.h>

@interface QQCellModel : NSObject

/**名字 */

@property (nonatomic ,copy ) NSString* name;

/**是否展开 */

@property (nonatomic , assign ) BOOL isShow;

/** 每组的数据 */

@property (nonatomic , strong ) NSMutableArray *array;

@end

实现类似QQ的折叠效果