[Swift] TableViewCellの一番上に謎のマージンができる

Question

Swift2でTableViewを書くと一番上のCellとTableHeaderViewの間に以下のようなマージンができてしまします。

グレーのTableHeaderViewとピンクのCellの間の白い部分です。

このマージンはTableHeaderViewを消した場合でも存在しています。

どなたか原因を知っている方がいましたら教えていただけると幸いです。

ソースコード自体はストーリーボードからtableViewを接続してシンプルに記述しています。

import UIKit

class MyPageViewController: UIViewController {

    @IBOutlet weak var tableView: UITableView!
    
    let menuList = ["プロフィールを編集する", "20Questionsに回答する", "アプリの設定", "興味カテゴリの編集"]
    
    override func viewDidLoad() {
        super.viewDidLoad()
    
        tableView.delegate = self
        tableView.dataSource = self
        
        self.setupTableViewHeader()
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
    
    func setupTableViewHeader(){
        tableView.tableHeaderView = UIView(frame: CGRect(x: 0, y: 0, width: 0, height: 150))
    }
}

/**
 *  UITableView Datasource
 */
extension MyPageViewController: UITableViewDataSource {
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return menuList.count
    }
    
    func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        return UIView()
    }
    
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Subtitle, reuseIdentifier: "Cell")
        
        cell.textLabel?.text = menuList[indexPath.row]
        return cell
    }
    
    func tableView(tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
        return nil
    }
}


/**
 *  UITableView Delegate
 */
extension MyPageViewController: UITableViewDelegate {
    func tableView(table: UITableView, didSelectRowAtIndexPath indexPath:NSIndexPath) {
        print(menuList[indexPath.row])
    }
}

またsetupTableViewHeader()関数の中身を以下のように

    func setupTableViewHeader(){
        let headerView: MyPageHeaderView = UINib(nibName: "MyPageHeader", bundle: nil).instantiateWithOwner(self, options: nil)[0] as! MyPageHeaderView
        headerView.bounds = CGRect(x: 0, y: 0, width: 0, height: 100)
        tableView.tableHeaderView = headerView
}

XiBから読み込む形に書き換えると

のように一番うえのCellがTableHeaderViewの下に潜り込んでしまいます。

これの原因も原因がわかる方がいればご回答いただけると幸いです。

MyPageHeaderViewの詳細

class MyPageHeaderView: UIView {
    @IBOutlet weak var profileImageView: UIImageView!
    
    override func awakeFromNib() {
        self.setupProfileImage()
    }
    
    func setupProfileImage(){
        profileImageView.layer.cornerRadius = 60
        profileImageView.layer.masksToBounds = true
        profileImageView.layer.borderColor = UIColor.redColor().CGColor
        profileImageView.layer.borderWidth = 2
    }
}

Xibの制約

Answer 1

#謎のマージン

それはセクションヘッダなので、表示したくないなら、

func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    return UIView()
}

を削除して下さい。

ついでにフッタ、nilを返しても表示されてませんか？表示したくないなら関数ごと削除しましょう。

func tableView(tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    return nil
}

#潜り込み

.xibから生成すると勝手にautoresizingMaskが設定されてしまうようで、これを無効にすれば潜りこまなくなると思います。headerViewの生成直後に下記のコードを追加して下さい。

headerView.autoresizingMask = [.None] //自動調整なし

逆に、コード生成して`autoresizingMask'を有効にすると、.xib生成時と同じように潜り込むと思います。

tableView.tableHeaderView!.autoresizingMask = [.FlexibleWidth, .FlexibleHeight] //幅と高さを自動調整

Comments

[YoheiFusayasu]

ありがとうございます！
消すと無事解決できました！！

しかし新たな問題が発生したので追記したのですが、こちらも見ていただけないでしょうか。。
こちらの新たな問題は解決の有無にかかわらずfuzzballさんをベストアンサーにはさせていただきます。。！

[fuzzball]

MyPageHeaderViewクラスの中（もしくは他の場所）で、高さを指定していたりしないでしょうか？画像を見ると200くらいありそうですけど。

[YoheiFusayasu]

高さは他の場所では全く設定していません。。
そうなんです、100と指定しているのに、100よりあきらかに大きく描画されています。
150とした場合は同様に大きくなります。
おそらく潜り込んでる部分のhight分、余計なものが出ているのだと思います。
しかしHeaderView自体に特別な操作は書いてある事以外加えておりません。。

(MyPageHeaderViewの詳細を追記しました)

[fuzzball]

My Page Header Viewの制約に警告が出ているようですので、まずそれを直して下さい。（そこで高さを指定してるんじゃ？）

[YoheiFusayasu]

遅れてすみません、こちらはUIを誤タップしてついてしまった警告でして、制約とは関係ありません、解除はすでにしました。
高さに関する制約は何もつけてはいない状態です。

[fuzzball]

直接高さの制約を付けていなくても、間接的に高さに影響する場合はありますよ。何かしら制約を付けているのならその情報を出して下さい。

提示されている情報だけで再現してみると正常に表示されますので、まだ出ていない情報に原因があると思われます。

[YoheiFusayasu]

ありがとうございます。追記で制約を記載いたしました。

制約を何も抜きにした状態などでも試してみたのですが、結果は同じでした。。

[YoheiFusayasu]

失礼しました、画像を間違えていたので上げ直しました。

[fuzzball]

回答に追記しました。
高さ、高さ、とうるさく言ってすみませんでしたｗ

[YoheiFusayasu]

ありがとうございます。。。解決しました。。感動です。。
本当にありがとうございました。