Xocde : AutoLayout > TabView & NavigationBar付きTableViewで背景にImageViewを使ったら、Layoutが崩れまくったので、その時した対処(メモ)

ひょんなことから、知人のお店アプリを以下の仕様で作成することになった。

• 環境
• Xcode8 & Swift3.0
• 仕様（超ざっくり）
• TabViewでページを切り替え
• TableViewで店舗一覧表示
• 店舗一覧で店舗をTapすると、詳細ページに行く

でもXcode 触るのもSwift書くのも1年以上ぶりで（そもそも当時もそんなにかけるほど触ってない）どうしようかと悩んで本屋に赴いたところ、すごく参考になる本が！

TECHNICAL MASTER はじめてのiOSアプリ開発 第2版 Xcode 8+Swift 3対応

自分がやりたい機能がほぼほぼ書かれていて、実戦向き＆それでいてわかりやすい。 （自分は使わなかったけど、書籍内ではAPIを使用して　TableViewに店舗一覧を表示することを実現していました。） Xcodeの使い方、Swiftの説明、AutoLayoutを使ったアプリ開発、Apple申請の仕方までこの一冊は本当にすごく重宝しました。

---

しかし問題が…。 Navigation BarつきのTable ViewとTableの詳細ページの背景に画像を使用しようとAuto Layoutを使用してImage Viewをおいたところ、まぁずれる。ずれる。 ↑の本のおかげで、昔から苦手だったAutoLayoutと仲良く慣れたと思ったのに。 ※ちなみに↑の本には、Image ViewをAutoLayoutを使用して背景にする使い方は書かれていませんでした。 自分の力不足としか言いようがない。

んで結果とりあえずどうしたかというと、

qiita.com

chocoffee.cafeblog.jp

onga-tec.hatenadiary.jp

上記のサイトを参考に背景のImage Viewだけ viewDidLoadで呼び出すということで解決｡･ﾟ･(ﾉД`)･ﾟ･｡ きっといつかAutoLayoutで実現してやる！

ちなみに参考サイトではSwift2.0以前っぽくて、CGRectMake が使われているんだけど、Swift3.0では使えなくなったみたいで…。 でもソッチのほうがすぐ解決できました。

    // TableViewがあるViewControllerのviewDidLoad()
    override func viewDidLoad() {
        super.viewDidLoad()
        let bgImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: self.tableView.frame.width, height:self.tableView.frame.height))
        let image = UIImage(named: "background_image.jpg")
        bgImageView.image = image
        bgImageView.alpha = 1
        self.tableView.backgroundView = bgImageView
    }

    override func viewDidLoad() {
       // TableView からshowdetailで遷移したViewControllerのviewDidLoad() に 以下を追加
        UIGraphicsBeginImageContext(self.view.frame.size)
        UIImage(named: "background_image.jpg")?.draw(in: CGRect(x: 0, y: 0, width: self.view.frame.width, height:self.view.frame.height))
        let bgImage: UIImage! = UIGraphicsGetImageFromCurrentImageContext()
        
        UIGraphicsEndImageContext()
        self.view.backgroundColor = UIColor(patternImage: bgImage)
    }