UITableView-Style的使用

UITableView的样式
UITableView的样式有两种，一种为UITableViewStylePlain普通样式（默认样式）；一种为UITableViewStyleGrouped分组样式。

typedef NS_ENUM(NSInteger, UITableViewStyle) {
    UITableViewStylePlain,          // regular table view 常规
    UITableViewStyleGrouped         // preferences style table view 偏好样式
};

创建UITableView
创建UITableView的方法有三种，如果不指定tableView的样式，则默认使用UITableViewStylePlain样式。

 //1.创建对象,不指定tableView的样式
UITableView * tableView = [UITableView new];
UITableView * tableView = [[UITableView alloc]init];
//2.创建对象，并设置其frame，不指定tableView的样式
UITableView * tableView = [[UITableView alloc]initWithFrame:self.view.bounds];
//3.创建对象，并设置其frame，指定tableView的样式为UITableViewStylePlain
UITableView * tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain];

同样的，当使用UItableViewController时，如果不指定tableView的样式，则默认使用UITableViewStylePlain样式。

1.创建视图控制器，不指定tableView的样式
YXSecTableViewController * c = [YXSecTableViewController new];
YXSecTableViewController * c = [[YXSecTableViewController alloc]init];
2.创建视图控制器，指定tableView的样式为UITableViewStyleGrouped
YXSecTableViewController * c = [[YXSecTableViewController alloc]initWithStyle:UITableViewStyleGrouped];

例子
这是本次例子使用的设计图：

设计图

根据这个设计图， 我们可以分析，该tableView的样式应该为UITableViewStyleGrouped，没有tableHeaderView，sectionHeaderView和tableFooterView，没有分割线，但有一个高度为5的sectioFooterView，用作分割各个单元格。
先不要吐槽，我知道，在cell中创建一个高度为5的view就可以了，后面会讲到。

分析完成
创建YXFirstTableViewController，继承UITableViewController，tableView的样式为默认样式。设置cell的高度为自动计算。使用xib来自定义cell，设置storeArr.count个section，每个section只有1个cell。使用属性设置sectionFooterHeight为5。

====== AppDelegate ======
- (UIViewController *)setRootVC{
    UIViewController * c = [NSClassFromString(@"YXFirstTableViewController") new];
    UINavigationController * navi = [[UINavigationController alloc]initWithRootViewController:c];
    return navi;
}

====== YXFirstTableViewController ======
#define kScreenW [UIScreen mainScreen].bounds.size.width
#define kScreenH [UIScreen mainScreen].bounds.size.height
#define YXRGB(r,g,b) [UIColor colorWithRed:r/255.0 green:g/255. blue:b/255.0f alpha:1]
#define YXSameRGB(v) YXRGB(v,v,v)

#pragma mark ============== Init ==============
- (void)setUpTable{
    self.tableView.rowHeight = UITableViewAutomaticDimension;
    self.tableView.estimatedRowHeight = 100;
    self.tableView.sectionFooterHeight = 5;
    [self.tableView registerNib:[UINib nibWithNibName:@"YXStoreTableViewCell" bundle:nil] forCellReuseIdentifier:@"YXStoreTableViewCell"];
}

#pragma mark ============== TableView ==============
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return storeArr.count;
}

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    UIView * view= [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreenW, 5)];
    view.backgroundColor = [UIColor colorWithRed:229/255.0 green:229/255.0 blue:220/255.0 alpha:1];
    return view;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    YXStoreTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"YXStoreTableViewCell"];
    cell.model = storeArr[indexPath.section];
    return cell;
}

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@"%s",__func__);
}

运行：使用属性设置self.tableView.sectionFooterHeight = 5;没有起作用。

并且当我的section数量只有几个时（显示的内容小于tableView的高度时），tableview最底端还会出现‘格外’的分割线。
思考：使用属性设置不行，那使用代理方法呢？
先不管分割线问题，我使用代理方法设置sectionFooterHeight的高度

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

运行：设置成功，并且没有了分割线！

但我发现sectionFooter的背景色太浅，使用数码测色计测出颜色为YXSameRGB(247)。
使用代理方法设置sectionFooter的背景颜色。

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    UIView * view= [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreenW, 5)];
    view.backgroundColor = YXSameRGB(229);
    return view;
}

运行：成功设置sectionFooter的背景颜色

滑动tableView，仔细观察，发现最底下的sectionFooter竟然跟随tableView一起滚动。
估计如果你也设置了header的话，效果也是一样。
这个效果，有好有坏，但这里，看起来并不友好，并且如果我的sectionFooter高度为30时，还会遮挡cell的内容，本来iphone屏幕就不大，这简直不可原谅。

解决方法：
设置tableView的style为Group

当使用UITableViewController时，设置tableView的style有两种方法：
由于我习惯使用NSClassFormString()方法创建视图控制器，所以我使用第二种方式设置tableView的style

1.创建视图控制的时候设置其style
YXSecTableViewController * c = [[YXSecTableViewController alloc]initWithStyle:UITableViewStyleGrouped];
2.覆盖其初始化方法，指定你想要的样式
-(instancetype)initWithStyle:(UITableViewStyle)style{
    if (self = [super initWithStyle:UITableViewStyleGrouped]){
    }
    return self;
}

运行：成功解决sectionFooter跟随tableView一起滚动的效果

但是出现了另外两个问题：
1.tableView的背景色改变了，使用数码测色计测出颜色为YXRGB(239,239,244)，原来是白色
2.多了tableHeaderView
3.多了sectionHeaderView

1.删除sectionHeaderView，
有鉴于前面使用属性设置sectionFooter的高度无效的情况，这次我使用代理方法设置sectionHeaderHeight

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

运行：代码不起作用

思考，使用代理方法设置sectionHeaderView能起作用吗？

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    UIView * view= [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreenW, 0)];
    return view;
}

运行：这仍然不起作用
一番折腾后,我发现:

1.当headerView的高度为0时，tableview会使用默认高度来设置sectionHeaderView的height
2.-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
代理方法的使用前提是要设置sectionHeaderHeight，否则该方法不起作用。

先不管footer是否也一样呢？
反推过来，当我的tableView的style为Plian时，使用属性设置sectionFooterHeight不起作用，需要使用代理方法来设置。
那么当我的tableView的style为Group时，我使用代理方法来设置sectionHeaderHeight不起作用，那使用属性设置呢？
使用属性设置sectionHeaderHeight：

self.tableView.sectionHeaderHeight = 0;

运行：成功设置了sectionHeaderHeight

2.删除tableHeaderView
当tableView的stlye为Plain时，我们想删除tableView底部格外的分割线有两种方法：

1.设置tableFooterView为一个size为0的view
self.tableView.tableFooterView = [UIView new];
2.设置分割线的样式为无分割线
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;

使用同样技巧，我设置tableHeaderView为一个size为0的view，虽然当前当style为Group，但我认为也是一样的

self.tableView.tableHeaderView = [UIView new];

运行：遗憾的是，这并不起作用。

我尝试使用以下方法，虽然我觉得结果是一样的。

[self.tableView setTableHeaderView:[UIView new]];

运行：果然还是不行。

没有办法了，你们呢？我只好把tableHeaderView的高度设置为5，这跟sectionFooterView一样了，这样看起来效果会好点。

UIView * tableHeader = [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreenW, 5)];
tableHeader.backgroundColor = YXSameRGB(229);
self.tableView.tableHeaderView = tableHeader;

好吧，看来这样的做法并不能达到跟设计图一样的效果。

在cell中创建一个高度为5的view
其实最简单的方法是在cell中创建一个高度为5的view，
创建YXSecTableViewController继承自UITableViewController，tableView的样式为默认样式Plain，设置分割线的样式为无分割线。

#pragma mark ============== Init ==============
- (void)setUpTable{
    self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
    self.tableView.rowHeight = UITableViewAutomaticDimension;
    self.tableView.estimatedRowHeight = 100;
    [self.tableView registerNib:[UINib nibWithNibName:@"YXSecStoreTableViewCell" bundle:nil] forCellReuseIdentifier:@"YXSecStoreTableViewCell"];
}

#pragma mark ============== TableView ==============
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return storeArr.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    YXSecStoreTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"YXSecStoreTableViewCell"];
    cell.model = storeArr[indexPath.section];
    return cell;
}

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@"%s",__func__);
}

运行：没有问题。