IOS實現(xiàn)展開二級列表效果
更新時間:2016年08月12日 12:07:48 投稿:daisy
本文通過實例代碼向大家演示在IOS中如何實現(xiàn)展開二級列表的效果,這個功能效果很好,對于日常開發(fā)APP中很有幫助,下面一起來看看如何實現(xiàn)吧。
先來看看效果圖

用法(類似UITableView)
初始化XDMultTableView
#import "XDMultTableView.h" ... @property(nonatomic, readwrite, strong)XDMultTableView *tableView; _tableView = [[XDMultTableView alloc] initWithFrame:CGRectMake(0, 64, self.view.frame.size.width, self.view.frame.size.height-64)]; _tableView.openSectionArray = [NSArray arrayWithObjects:@1,@2, nil]; _tableView.delegate = self; _tableView.datasource = self; _tableView.backgroundColor = [UIColor whiteColor]; [self.view addSubview:_tableView];
實現(xiàn)數(shù)據(jù)源
- (NSInteger)mTableView:(XDMultTableView *)mTableView numberOfRowsInSection:(NSInteger)section{
return 5;
}
- (XDMultTableViewCell *)mTableView:(XDMultTableView *)mTableView
cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString *cellIdentifier = @"cell";
UITableViewCell *cell = [mTableView dequeueReusableCellWithIdentifier:cellIdentifier];
if (cell == nil)
{
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
}
UIView *view = [[UIView alloc] initWithFrame:cell.bounds] ;
view.layer.backgroundColor = [UIColor whiteColor].CGColor;
view.layer.masksToBounds = YES;
view.layer.borderWidth = 0.3;
view.layer.borderColor = [UIColor lightGrayColor].CGColor;
cell.backgroundView = view;
cell.selectionStyle = UITableViewCellSelectionStyleNone;
return cell;
}
- (NSInteger)numberOfSectionsInTableView:(XDMultTableView *)mTableView{
return 6;
}
-(NSString *)mTableView:(XDMultTableView *)mTableView titleForHeaderInSection:(NSInteger)section{
return @"我是頭部";
}
實現(xiàn)代理
- (CGFloat)mTableView:(XDMultTableView *)mTableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return 50;
}
- (CGFloat)mTableView:(XDMultTableView *)mTableView heightForHeaderInSection:(NSInteger)section{
return 40;
}
- (void)mTableView:(XDMultTableView *)mTableView willOpenHeaderAtSection:(NSInteger)section{
NSLog(@"即將展開");
}
- (void)mTableView:(XDMultTableView *)mTableView willCloseHeaderAtSection:(NSInteger)section{
NSLog(@"即將關(guān)閉");
}
- (void)mTableView:(XDMultTableView *)mTableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"點擊cell");
}
列表展開關(guān)閉的實現(xiàn)原理
在section header注冊一個手勢
//section header view 設(shè)置tag值為section view.tag = section; UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapHeader:)]; [view addGestureRecognizer:tap];
手勢的響應(yīng)事件
- (void)tapHeader:(UITapGestureRecognizer *) tap {
NSInteger section = tap.view.tag;
NSNumber *sectionObj = [NSNumber numberWithInteger:section];
UIImageView *imageView = (UIImageView *)[tap.view viewWithTag:100];
//_multopenSectionArray 用于記錄每個 section的展開和關(guān)閉狀態(tài)
if ([_multopenSectionArray containsObject:sectionObj]) {
NSArray *deleteArray = [self buildDeleteRowWithSection:section];
[_multopenSectionArray removeObject:sectionObj];
//想關(guān)閉的section的所有indexPath
[_tableView deleteRowsAtIndexPaths:deleteArray withRowAnimation:UITableViewRowAnimationFade];
[UIView animateWithDuration:0.3 animations:^{
imageView.transform = CGAffineTransformMakeRotation(-M_PI/2);
}];
}else{
[_multopenSectionArray addObject:sectionObj];
//想展開的section的所有indexPath
NSArray *insertArray = [self buildInsertRowWithSection:section];
[_tableView insertRowsAtIndexPaths:insertArray withRowAnimation:UITableViewRowAnimationFade];
[UIView animateWithDuration:0.3 animations:^{
imageView.transform = CGAffineTransformMakeRotation(0);
}];
}
}
總結(jié)
以上就是IOS實現(xiàn)展開二級列表效果的全部內(nèi)容,希望對大家學習開發(fā)IOS能有所幫助。
相關(guān)文章
詳解iOS應(yīng)用UI開發(fā)中的九宮格坐標計算與字典轉(zhuǎn)換模型
這篇文章主要介紹了iOS應(yīng)用UI開發(fā)中的九宮格坐標計算與字典轉(zhuǎn)換模型,代碼基于傳統(tǒng)的Objective-C,需要的朋友可以參考下2016-01-01
IOS 出現(xiàn)錯誤reason: image not found的解決方案
這篇文章主要介紹了IOS 出現(xiàn)錯誤reason: image not found的解決方案的相關(guān)資料,需要的朋友可以參考下2017-05-05

