近期項(xiàng)目改版眠屎,新加了二級列表展開的需求剔交,效果如下:
邏輯分析:
二級列表,主要功能是子列表的折疊和展開改衩,且默認(rèn)是折疊狀態(tài)岖常。這就需要用到tableView的section 和 row,即section 是父列表單元,每個(gè)section下的row為子列表單元葫督,且每次點(diǎn)擊section需要存儲(chǔ)點(diǎn)擊狀態(tài)竭鞍,從而表現(xiàn)子列表的折疊和展開效果。由于接口數(shù)據(jù)也是二級表單橄镜,因此model在創(chuàng)建時(shí)也是二級結(jié)構(gòu)偎快,這點(diǎn)需要注意。
代碼:
#import "studentMemberListView.h"
@interface studentMemberListView ()<UITableViewDelegate,UITableViewDataSource>
{
BOOL status[10];//結(jié)構(gòu)體用于存儲(chǔ)section點(diǎn)擊的bool值
}
@property(nonatomic, strong)UITableView *memberList;
@end
@implementation studentMemberListView
- (id)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
self.backgroundColor = [UIColor whiteColor];
[self addSubUI];
//默認(rèn)第一個(gè)分組是打開的
status[0] = YES;
}
return self;
}
-(void)addSubUI
{
[self addSubview:self.memberList];
self.memberList.frame = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
}
#pragma mark -----tableDelgate&dataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:
(NSInteger)section{
BOOL closeAge = status[section];
//關(guān)閉顯示為0行
if (closeAge == NO) {
return 0;
}
return 3;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:
(NSIndexPath *)indexPath{
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell1"];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell1"];
cell.backgroundColor = [UIColor whiteColor];
cell.textLabel.textColor = [UIColor grayColor];
}
cell.textLabel.text = @"subcell11111111";
return cell;
}
- (void)sectionAction:(UIControl *)control{
NSInteger section = control.tag;
status[section] = !status[section];
NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:section];
[_memberList reloadSections:indexSet withRowAnimation:UITableViewRowAnimationNone]; //刷新制定單元格
return cell;
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 3;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
//設(shè)置cell 高度
return 76;
}
//section的header view的高度
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
return 44;
}
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:
(NSIndexPath *)indexPath{
[tableView deselectRowAtIndexPath:indexPath animated:YES];
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
NSLog(@"Section:%d Row:%d selected and its data is %@",
indexPath.section,indexPath.row,cell.textLabel.text);
[tableView deselectRowAtIndexPath:indexPath animated:NO];
//推出到子VC
//[self.navigationController pushViewController:[[studentDeatilViewController alloc] init] animated:YES];
}
//自定義section的header view
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
UIControl *titileView = [[UIControl alloc] initWithFrame:CGRectZero];
titileView.tag = section;
[titileView addTarget:self action:@selector(sectionAction:) forControlEvents:UIControlEventTouchUpInside];
//設(shè)置 頭視圖的標(biāo)題
UILabel *titleLable = [[UILabel alloc] initWithFrame:CGRectMake(40, 12, 100, 30)];
titleLable.backgroundColor = [UIColor clearColor];
titleLable.textColor = [UIColor blackColor];
titleLable.font = [UIFont systemFontOfSize:18];
titleLable.text = @"title111111111111";
[titleLable sizeToFit];
[titileView addSubview:titleLable];
return titileView;
}
-(UITableView *)memberList
{
if (!_memberList) {
_memberList = [[UITableView alloc]initWithFrame:CGRectZero style:UITableViewStyleGrouped];
_memberList.delegate = self;
_memberList.dataSource = self;
_memberList.backgroundColor = [UIColor whiteColor];
_memberList.separatorStyle = UITableViewCellSeparatorStyleNone;
[_memberList registerClass:[UITableViewCell class] forCellReuseIdentifier: @"cell"1];
}
return _memberList;
}
這里需要說的是洽胶,一開始筆者是打算用model來存儲(chǔ)section的點(diǎn)擊bool值的晒夹,但是在參考囧囧的文章后,發(fā)現(xiàn)其引入的結(jié)構(gòu)體status更簡潔妖异,于是惋戏,這里借用了一下。
需要注意的是:status[10]為C語言中的結(jié)構(gòu)體他膳,這里你可以理解為oc語言中:一個(gè)數(shù)組+字典的概念响逢,具體這里不展開敘述,有要求可百度了解棕孙,而10則為結(jié)構(gòu)體的空間舔亭,如果你需要開辟多個(gè),那將10增大即可蟀俊。
另外添加一個(gè)在開發(fā)二級列表中遇到的問題:列表在大于一頁時(shí)钦铺,展開子類表再折疊后,列表會(huì)上下抖動(dòng)肢预。在我查閱相關(guān)資料后得知矛洞,抖動(dòng)是因?yàn)榱斜頉]有設(shè)置初始高度,再后期展開再折疊刷新section后烫映,系統(tǒng)IOS11后列表為了優(yōu)化布局沼本,會(huì)重新計(jì)算高度,因此會(huì)出現(xiàn)抖動(dòng)锭沟。解決方法如下:
1.在刷新時(shí)添加performWithoutAnimationBlock:
//刷新制定單元格
[UIView performWithoutAnimation:^{
[self.memberList reloadSections:indexSet withRowAnimation:UITableViewRowAnimationNone];
}];
2.在tableView初始化時(shí)設(shè)定列表初始高度:
-(UITableView *)memberList
{
if (!_memberList) {
_memberList = [[UITableView alloc]initWithFrame:CGRectZero style:UITableViewStyleGrouped];
_memberList.delegate = self;
_memberList.dataSource = self;
_memberList.backgroundColor = [UIColor whiteColor];
_memberList.separatorStyle = UITableViewCellSeparatorStyleNone;
[_memberList registerClass:[UITableViewCell class] forCellReuseIdentifier: @"cell"1];
if (@available(iOS 11.0, *)) {
//設(shè)定默認(rèn)cell高度抽兆,防止展開頁面抖動(dòng)
UITableView.appearance.estimatedRowHeight = 0;
UITableView.appearance.estimatedSectionFooterHeight = 0;
UITableView.appearance.estimatedSectionHeaderHeight = 0;
}
}
return _memberList;
}
至此,二級列表相關(guān)問題解決如此族淮,你學(xué)廢了嗎辫红?