iOS如何让UITableView Section的headerView、footerView跟随cell一起滚动方法总结

网上解决这个问题大致有两种方法:

  • 将 tableView 的 style 设置为 UITableViewStyleGrouped
  • 将 headerView 赋值给 tableHeaderView 而不是 sectionHeaderVidw

但这两种方法有时候并不好用。所以,为了实现分组效果,但是又不希望分组的标签栏(SectionHeaderView或者SectionFooterView)悬停,还有没有其他的实现方式呢?

比较好用的一种方法:
网上还有一种重写ScrollView代理函数的方法,这个方法比较好用,原理是将tableView的content不断上移,逐渐隐藏在导航栏下,其实它依然是悬停的,只不过我们看不到罢了。

1
2
3
4
5
6
7
8
9
10
11
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    
    CGFloat sectionHeaderHeight = section的高度;
    if (scrollView.contentOffset.y <= sectionHeaderHeight && scrollView.contentOffset.y> 0) {
        scrollView.contentInset = UIEdgeInsetsMake(-scrollView.contentOffset.y, 0, 0, 0);
    }else{
        if(scrollView.contentOffset.y >= sectionHeaderHeight){
            scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, 0, 0);
        }
    }
}

但是据说添加了下拉刷新的话就会有bug了,因为很多下拉刷新也是通过设置contentInset实现的,所以有下拉刷新的可能会有一定问题,没有试,具体效果不详

还有一种跟上面比较类似的方法,是重写headSectionView的setframe方法,供参考

1
2
3
4
5
-(void)setFrame:(CGRect)frame{
CGRect sectionRect = [self.tableView rectForSection:self.section];
CGRect newFrame = CGRectMake(CGRectGetMinX(frame), CGRectGetMinY(sectionRect), CGRectGetWidth(frame), CGRectGetHeight(frame));
[super setFrame:newFrame];
}

这里给大家介绍另一个思路:
也许这个办法很笨拙,但是在一些走投无路场合也许就会帮到你。

如果我们把标签这一栏作为一个特殊的分组是不是可以解决这个问题呢?答案是肯定的。如果按照这个思路来做,那么接下来要做的就是在tableView的代理函数中做一些判断和修改。

假设我们有两个分组的数据要展示,并且每个分组前的标签要跟随cell一起滚动。
原本应该是这样的

1
2
3
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 2;
}

但这时则要return 4;,因为我们把两个标签栏也作为了一个分组。

同样

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{

    switch (section) {
        case 0: return 1; break;
case 1: return _section1DataArr.count; break;
        case 2: return 1; break;
case 3: return _section2DataArr.count; break;
        default: return 0; break;
    }
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    switch (indexPath.section) {
        case 0: return 50; break;
        case 1: return 40; break;
        case 2: return 50; break;
        case 3: return 40; break;
        default: return 0; break;
    }
}

相信你已经明白如何实现了,其他的代理函数中的实现就不赘述了。

效果如下:

版权声明:出自Jerry LMJ的原创作品,未经作者允许不得转载。

当前网速较慢或者你使用的浏览器不支持博客特定功能,请尝试刷新或换用Chrome、Firefox等现代浏览器