TableView類似QQ分組的折疊與展開

類似QQ分組的樣子调煎,實現(xiàn)tableView的折疊與展開陨界。其實要做這個效果我先想到的是在tableView中再嵌套多個tableView索抓,這個想法實現(xiàn)起來就有點難了源内。
所以還是換個思路,把tableView的HeaderView用上了瘟则。給headerView加上手勢黎炉,輕松解決折疊展開的問題。
直接上代碼吧醋拧。

@property (nonatomic, strong) UITableView *myTableView;  
@property (nonatomic, strong) NSMutableArray *listArray;        // 數(shù)據(jù)源
@property (nonatomic, strong) NSMutableArray *titlesArray;     // 分組的名稱
@property (nonatomic, strong) NSMutableDictionary *openSectionDict; // 記錄哪個組展開
- (void)viewDidLoad {
    [super viewDidLoad];
    // 初始化tableView
    _myTableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStyleGrouped];
    self.myTableView.delegate = self;
    self.myTableView.dataSource = self;
    [self.view addSubview:_myTableView];
    
    self.openSectionDict = [[NSMutableDictionary alloc] init]; // 初始化字典
    [self setUpData];
}
// 給數(shù)據(jù)源賦值
- (void)setUpData {
    self.listArray = [NSMutableArray new];
    self.titlesArray = [NSMutableArray new];
    for (int i = 0; i < 5; i++) {     // 5個section
        [self.titlesArray addObject:[NSString stringWithFormat:@"section %d", i]];
        NSMutableArray *array = [NSMutableArray new];
        for (int i = 0; i < 4; i++) {   // 每個section有4個row
            [array addObject:[NSString stringWithFormat:@"row %d", i]];
        }
        [self.listArray addObject:array];
    }
}
// 實現(xiàn)tableView的代理方法
#pragma mark - tableView dataSource
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 5;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    if ([[self.openSectionDict valueForKey:[NSString stringWithFormat:@"%ld", section]] integerValue] == 0) {    //根據(jù)記錄的展開狀態(tài)設置row的數(shù)量
        return 0;
    } else {
        return 4;
    }
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"CELL_ID"];
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:@"CELL_ID"];
        cell.textLabel.text = [NSString stringWithFormat:@"row %ld", indexPath.row];
    }
    return cell;
}

#pragma mark - tableView delegate
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return 45;
}

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

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    
    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, 40)];
    view.backgroundColor = [UIColor whiteColor];
    view.tag = KTAG + section;
    
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(20, 0, view.bounds.size.width, view.bounds.size.height)];
    label.text = self.titlesArray[section];
    [view addSubview:label];
    
    if ([[self.openSectionDict valueForKey:[NSString stringWithFormat:@"%ld", section]] integerValue] == 0) {
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(10, (view.bounds.size.height - 10) / 2, 7, 10)];
        imageView.image = [UIImage imageNamed:@"Triangle_right_gray"];   //  三角形小圖片
        [view addSubview:imageView];
    } else {
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(10, (view.bounds.size.height - 7) / 2, 10, 7)];
        imageView.image = [UIImage imageNamed:@"Triangle_down_gray"];
        [view addSubview:imageView];
    }
    
    UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(collegeTaped:)];
    [view addGestureRecognizer:tap];
    
    return view;
}

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

#pragma mark - sectionHeader clicked
- (void)collegeTaped:(UITapGestureRecognizer *)sender {
    NSString *key = [NSString stringWithFormat:@"%ld", sender.view.tag - KTAG];
    //   給展開標識賦值
    if ([[self.openSectionDict objectForKey:key] integerValue] == 0) {
        [self.openSectionDict setObject:@"1" forKey:key];
    } else {
        [self.openSectionDict setObject:@"0" forKey:key];
    }
    NSUInteger index = sender.view.tag;
    NSIndexSet *set = [NSIndexSet indexSetWithIndex:index - KTAG];
    [self.myTableView reloadSections:set withRowAnimation:UITableViewRowAnimationFade];
}

最后的效果:

Simulator Screen Shot 2016年11月14日 下午2.46.25.png
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末慷嗜,一起剝皮案震驚了整個濱河市淀弹,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌庆械,老刑警劉巖薇溃,帶你破解...
    沈念sama閱讀 216,470評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異缭乘,居然都是意外死亡痊焊,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,393評論 3 392
  • 文/潘曉璐 我一進店門忿峻,熙熙樓的掌柜王于貴愁眉苦臉地迎上來薄啥,“玉大人,你說我怎么就攤上這事逛尚÷⒕澹” “怎么了?”我有些...
    開封第一講書人閱讀 162,577評論 0 353
  • 文/不壞的土叔 我叫張陵绰寞,是天一觀的道長到逊。 經常有香客問我,道長滤钱,這世上最難降的妖魔是什么觉壶? 我笑而不...
    開封第一講書人閱讀 58,176評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮件缸,結果婚禮上铜靶,老公的妹妹穿的比我還像新娘。我一直安慰自己他炊,他們只是感情好争剿,可當我...
    茶點故事閱讀 67,189評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著痊末,像睡著了一般蚕苇。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上凿叠,一...
    開封第一講書人閱讀 51,155評論 1 299
  • 那天涩笤,我揣著相機與錄音,去河邊找鬼盒件。 笑死蹬碧,一個胖子當著我的面吹牛,可吹牛的內容都是我干的履恩。 我是一名探鬼主播锰茉,決...
    沈念sama閱讀 40,041評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼呢蔫,長吁一口氣:“原來是場噩夢啊……” “哼切心!你這毒婦竟也來了飒筑?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 38,903評論 0 274
  • 序言:老撾萬榮一對情侶失蹤绽昏,失蹤者是張志新(化名)和其女友劉穎协屡,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體全谤,經...
    沈念sama閱讀 45,319評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡肤晓,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,539評論 2 332
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了认然。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片补憾。...
    茶點故事閱讀 39,703評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖卷员,靈堂內的尸體忽然破棺而出盈匾,到底是詐尸還是另有隱情,我是刑警寧澤毕骡,帶...
    沈念sama閱讀 35,417評論 5 343
  • 正文 年R本政府宣布削饵,位于F島的核電站,受9級特大地震影響未巫,放射性物質發(fā)生泄漏窿撬。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,013評論 3 325
  • 文/蒙蒙 一叙凡、第九天 我趴在偏房一處隱蔽的房頂上張望劈伴。 院中可真熱鬧,春花似錦握爷、人聲如沸宰啦。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,664評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽赡模。三九已至,卻和暖如春师抄,著一層夾襖步出監(jiān)牢的瞬間漓柑,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,818評論 1 269
  • 我被黑心中介騙來泰國打工叨吮, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留辆布,地道東北人。 一個月前我還...
    沈念sama閱讀 47,711評論 2 368
  • 正文 我出身青樓茶鉴,卻偏偏與公主長得像锋玲,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子涵叮,可洞房花燭夜當晚...
    茶點故事閱讀 44,601評論 2 353

推薦閱讀更多精彩內容