IOS UI学习 UITableView Demo 实现类似QQ联系人收起和展开效果

UItableView 日常学习总结

实现类似 QQ联系人收起和展开的效果

思路

就是 自定义Header 在它上面添加一个Button 或者一个点击手势 ，我是添加了一个手势

每一个分区设置一个状态为表示为收起和展开 (bool 型 即可)

当判断为收起时将分区 section的row数量设置为0，即不显示任何内容

当判断为展开时将分区 section的row数量设置为要显示的内容的数目

然后重载分区即可

重载分区方法

//重载分区 [_tableV reloadSections:[NSIndexSet indexSetWithIndex:section] withRowAnimation:UITableViewRowAnimationFade];

问题与解答

遇到的一个问题是，本来以为自定义了Header后，可以不设置Header的高度即可，但是其实是不行的，如果不设置header的高度，第一个分区 section的header将不会显示，所以，必须给section设置一个高度

code：

AppDelegate代码

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

self.window = [[UIWindow alloc]initWithFrame:[[UIScreen mainScreen] bounds]];
self.window.backgroundColor = [UIColor whiteColor];
RootViewController * root = [[RootViewController alloc]init];
UINavigationController * una = [[UINavigationController alloc]initWithRootViewController:root];
self.window.rootViewController = una;

[self.window makeKeyAndVisible];

return YES;
}

　

ViewController.m代码

#import "RootViewController.h"

@interface RootViewController ()

@end

@implementation RootViewController
{
UITableView  * _tableV;
NSMutableArray * _dataArr; //cell 元数据  貌似没什么用
NSMutableDictionary * _numDict;  //记录分区收起 与 展开的状态
}

- (void)viewDidLoad
{
[super viewDidLoad];

[self createData];

[self createTableView];
}

#pragma mark 创建UITableView
-(void)createTableView
{
_tableV = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStyleGrouped];
_tableV.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
_tableV.delegate = self;
_tableV.dataSource = self;
[self.view addSubview:_tableV];
}

#pragma mark 初始化数据
-(void)createData
{
_dataArr = [[NSMutableArray alloc] init];
for (NSInteger i = 0; i<10; i++)
{
NSString * str = [NSString stringWithFormat:@"data %ld",i];
[_dataArr addObject:str];
}

_numDict = [[NSMutableDictionary alloc] init];
for (NSInteger i = 0; i<10; i++)
{
NSNumber * num = [[NSNumber alloc] initWithBool:YES];
NSString * str = [NSString stringWithFormat:@"%ld",i];

[_numDict setObject:num forKey:str];
}
}

#pragma mark 协议方法
//num of row in section
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
NSString * str = [NSString stringWithFormat:@"%ld",section];
if ([_numDict[str] boolValue] == YES)
{
return _dataArr.count;
}
else
return 0;
}

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

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 4;
}
#pragma mark  重要 刚开始第一个 section的 自定义header不显示，因为没有设置header 的高度 height

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 40;
}
//height for row
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return 50;
}

#pragma mark 本工程重点 自定义header of cell实现

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

NSString * str = [NSString stringWithFormat:@"%ld",section];
NSLog(@"%@",str);
UIView * view = [[UIView alloc] init];
view.backgroundColor = [UIColor blueColor];
view.frame = CGRectMake(0, 0, 320, 40);
view.alpha = 0.3;

UIImageView * imageV = [[UIImageView alloc] init];
imageV.userInteractionEnabled = YES;
imageV.frame = CGRectMake(10, 5, 30, 30);
if ([_numDict[str] boolValue] == YES)
{
imageV.image = [UIImage imageNamed:@"arrow_fold.png"];
}
else
imageV.image = [UIImage imageNamed:@"arrow_spread.png"];

view.tag = section + 10;
NSLog(@"view tag %ld",view.tag);
[view addSubview:imageV];

UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapView:)];

tap.numberOfTapsRequired = 1;

tap.numberOfTouchesRequired = 1;

//添加手势
[view addGestureRecognizer:tap];

return view;
}

-(void)tapView:(UITapGestureRecognizer*)tap
{
NSInteger section = tap.view.tag - 10;
NSLog(@"tapview section %ld",section);
NSString * str = [NSString stringWithFormat:@"%ld",section];
BOOL ret = [_numDict[str] boolValue];
ret = !ret;
[_numDict setObject:[NSNumber numberWithBool:ret] forKey:str];

//重载分区
[_tableV reloadSections:[NSIndexSet indexSetWithIndex:section] withRowAnimation:UITableViewRowAnimationFade];
}

-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
return 1;
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

/*
#pragma mark - Navigation

// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
// Get the new view controller using [segue destinationViewController].
// Pass the selected object to the new view controller.
}
*/

@end