【Objective-C】UITableViewのHeader、Footerを固定させない

こんにちは！
先日、UI改修をしている中で、「テーブルビューのスクロール時にヘッダーとフッターを一緒にスクロールさせたい！」ということがありました...

「ヘッダー、フッターのどちらかを固定しない」という記事はあったのですが、どちらも固定しない記事は見つけられなかったので、私がした対処を書いておきます。

## コード

``` Objective-C:InitialViewController.m

#import "InitialViewController.h"

@interface InitialViewController () <UITableViewDataSource, UITableViewDelegate>
@property (weak, nonatomic) IBOutlet UITableView *tableView;

@end

@implementation InitialViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.tableView.dataSource = self;
    self.tableView.delegate = self;

    [self scrollViewDidScroll:self.tableView];
}


// MARK: - UITableViewDataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 5;
}

- (UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSString *cellName = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellName forIndexPath:indexPath];
    cell.textLabel.text = [NSString stringWithFormat:@"%ld - %ld", indexPath.section, indexPath.row];
    return cell;
}


// MARK: - UITableViewDelegate
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 5;
}

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    return [NSString stringWithFormat:@"Header - %ld", section];
}

- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section
{
    return [NSString stringWithFormat:@"Footer - %ld", section];
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGFloat offsetY = scrollView.contentOffset.y;
    CGFloat sectionHeaderHeight = self.tableView.sectionHeaderHeight;
    CGFloat sectionFooterHeight = self.tableView.sectionFooterHeight;
    CGFloat bottomHeight = scrollView.contentSize.height - self.tableView.frame.size.height;

    if (offsetY <= sectionHeaderHeight && offsetY >= 0) {
        scrollView.contentInset = UIEdgeInsetsMake(-offsetY, 0, -sectionFooterHeight, 0);
    } else if (bottomHeight-sectionFooterHeight > scrollView.contentOffset.y && offsetY >= 0) {
        scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, -sectionFooterHeight, 0);
    } else if (offsetY >= bottomHeight) {
        scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, 0, 0);
    } else if (offsetY >= sectionHeaderHeight) {
        scrollView.contentInset = UIEdgeInsetsMake(-offsetY, 0, -sectionFooterHeight, 0);
    }
}

@end

```

gitHubにもあげています！！
https://github.com/IshibaSeiko/UntrackingHeaderTable.git

## 解説
まず、ViewDidLoadに ` [self scrollViewDidScroll:self.tableView]; ` を書きます。
初期表示の際にヘッダーやフッターが表示されないように、更新しておきます！

そして、 ` - (void)scrollViewDidScroll:(UIScrollView *)scrollView ` では何をやっているかというと...

```
if (offsetY <= sectionHeaderHeight && offsetY >= 0) {
        scrollView.contentInset = UIEdgeInsetsMake(-offsetY, 0, -sectionFooterHeight, 0);
    }
```
スクロールした領域がテーブルのトップからヘッダーまでの時、スクロールビューの領域をスクロールした分広げます。

![IMG_0004.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532881/e6fb2845-9494-0c92-37b1-287d7660f0fb.png)



```
if (bottomHeight-sectionFooterHeight > scrollView.contentOffset.y && offsetY >= 0) {
        scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, -sectionFooterHeight, 0);
    }
```
テーブルの一番下のセルから、テーブルの一番下が表示領域に入っているときは、スクロールビューの領域を上はヘッダー分、下はフッター分広げます。
![IMG_0005.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532881/2f06a308-4bb6-6806-a4e2-7185abe0ee0b.png)


```
if (offsetY >= bottomHeight) {
        scrollView.contentInset = UIEdgeInsetsMake(-sectionHeaderHeight, 0, 0, 0);
    }
```
テーブルの一番下までスクロールしたときは、スクロールビューの領域をヘッダー分広げます。
![IMG_0006.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532881/e28c5f3b-4ec2-1d52-f4ec-0b21acc30bb5.png)


```
if (offsetY >= sectionHeaderHeight) {
        scrollView.contentInset = UIEdgeInsetsMake(-offsetY, 0, -sectionFooterHeight, 0);
    }
```
ヘッダーより下にスクロールしたときは、スクロールビューの領域を上はスクロールした分、下はフッター分広げます。
![IMG_0007.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532881/fc4ceac5-f804-e376-784c-e73c3d3ce8c1.png)

下手すぎて絵の意味がないかもしれませんが、、、こんなイメージです。

## 参考にした記事
この、テーブルビューのヘッダー、フッターを固定せず、スクロールさせる対応をするにあたって、
下記の記事を参考にさせていただきました。ありがとうございます。

UITableViewでSectionHeader/SectionFooterを残さない方法
https://qiita.com/Yuta/items/a804a25d82ade964b315

UITableViewでセクションフッターをページ下部に残さない・固定しない方法
http://yandr.randy.boy.jp/?eid=9

## まとめ
今後のために、とりあえずまとめておきました。