社畜系WEBエンジニアの消耗戦

読者です 読者をやめる 読者になる 読者になる

社畜系WEBエンジニアの消耗戦

修羅の国でせっせと働く社畜系WEBエンジニアのブログ

横スクロールのヘッダーと縦スクロールのコンテンツ部分を持つUITableViewの実装方針

実案件でコードは載せられませんので、基本的な実装方針だけ。ちゃちゃっと書いておきます。

前提

SwiftBond+SwiftTaskのなんとなく今っぽい作りをしたアプリを想定して書いています。

APIを叩いて取得したデータAをヘッダーに当て込んで横スクロール、APIを叩いて取得したデータBをコンテンツに当て込んで縦スクロールさせるような画面を作っていきます。

ニュースサイトでよく見る形ですね。あれを実装します。

WEBアプリならクソ簡単なんですけど、毛嫌いしているSwiftでやると全てが難しいです。というかBondの部分かな。。

ページ全体の作り

ページ自体は、UITableViewで作ります。なんの問題もない。

ヘッダー部分の作り

ここが今回一番苦労したところ。

  • UITableViewに、ダミーで準備したヘッダーのUIViewtableHeaderViewする
  • さらにUIScrollViewaddSubViewする
  • APIを叩いて取得したデータをループさせてUIViewを作る
  • 上記のUIViewを更にaddSubViewする
  • 取得したデータの個数に応じてUIPageControlの丸の数を決めて生成する
  • これを更にaddSubViewする

これで、UITableView.tableHeaderView > UIScrollView > UIViewが出来てハッピー。

データが取得出来なかった時とか、そのへんの周辺の実装はまぁよしなにしてください。

コンテンツ部分の作り

普通にBondでUITableViewCellをBondでbindToすればOKです。

おわりに

実装出来てよかった。これで抜け毛も減る。

でもまだBondはよくわかっていない。自分で1個つくらないといかんねこれは。