Instagramユーザープロフィール画面のアーキテクチャについて

iOSアプリの2019年現在のInstagramのユーザープロフィール画面のアーキテクチャ及びその実装方法についてうかがいたいです。
該当画面は以下になります。

実装したい事

スクロールすると３タブが画面上部に張り付くようにする事。
3タブ以下の画面はそれぞれ別画面として独立している事。
3タブ以下の画面をスクロールすると横のタブの画面にスライドする事

動作を動画で見たい場合は以下のURLから確認できます。
https://drive.google.com/file/d/1k2kQUQAu6tSiEn3wSu74i0BlqyX-7buD/view?usp=sharing

自分が考えた事
以下の画像が自分が考えた設計ですが、このようにcollectionview内にそれぞれ独立したView(またはViewController)を埋め込むことができるようには思えないのですが、他の方法が思いつきませんでした。

究極スクロールすると横のタブの画面にスライドする機能はいらないのですが、それでも他の二点の機能を満たした上で上記の画面のような実装方法を知っている方がいらっしゃれば是非アドバイス頂きたいです。

よろしくお願い致します。

行動規範の内容に同意します

回答1件

動画パッと見で。（アプリは使ったことないです）

全体はTableViewで、

text
1+----------------+
2|                |
3|                |
4|    Profile     | Cell #0-0
5|                |
6|                |
7+----------------+
8|     3 Tabs     | Section #1
9+----------------+
10|                |
11|                |
12|    Timeline    | Cell #1-0
13|                |
14|                |
15+----------------+

こんな感じ。

Timelineセルの中身はCollectionView。

投稿2019/04/05 01:57

fuzzball

総合スコア16731

daicky777

2019/04/07 23:32

ご回答ありがとうございます。 Timelineセルの中身はコレクションビューということですが、例えばタブの一番目を押したあと、二番目を押して、また最後に一番目を押すと、最初に一番目のタブを押した画面の状態が戻っています。以上の点で3タブを押して表示されるリストはそれぞれ3つ独立して存在し、タブを押すたびにリストの表示、非表示を制御しているかとおもわれますが、それをtablviewと(おそらく3つの)collectionviewを使ってどのように再現するのでしょうか？宜しくお願い致します。

fuzzball

2019/04/08 00:22

>>最初に一番目のタブを押した画面の状態が戻っていますというのは、スクロール位置が一番上になってしまう、ということでしょうか？それなら、タブ切り替え時にスクロール位置を再設定すればいいと思いますけども。

daicky777

2019/04/08 13:53 編集

すいません。例えがわかりづらかったかもしれません。３タブのうちの一つのリストを横にスライドすると、隣のタブのリストが表示されます。このことからtimelineセルに独立した3つのリストがそれぞれ存在しているように見えますが、そのように実装されているのがInstagramの実装のように思われますがいかがでしょうか？

fuzzball

2019/04/09 02:34 編集

動画からは、各タブの縦スクロールが独立しているということは把握できませんでした。横幅が三画面分のScrollViewを置いて、その中にCollectionViewを３つ並べる、というような感じでしょうか。

daicky777

2019/04/11 20:22

そのScrollViewと外側のcollectionViewの縦方向のスクロールがしっかり連動するかどうかが懸念ですが、とりあえずやってみます！ご回答ありがとうございました！

行動規範の内容に同意します