我該如何構建這個視圖呢？

Question

我很難找到構建這種設計的最佳方法。

頂視圖具有最小高度，並在達到此高度時變粘。 底部視圖托管一個具有三個視圖的分頁控制器。 這些視圖中的每一個都承載具有垂直滾動的集合視圖或表視圖。

我真的不知道如何處理這個問題。 整個視圖是否可滾動，我應該阻止在第二個視圖上滾動，直到頂視圖達到它的粘性高度？ 或者這些視圖中的每一個都是單獨的uitableviews，而尋呼控制器只是一個單元格？ 我是否應該使用分頁控制器，還是應該使用啟用分頁的scrollview？ （后者有點粗糙的互動方式）

謝謝！

Answer 1

今年使用 WWDC的Collection View查看高級用戶界面 。 此視圖與iTunes Connect應用程序界面非常相似。 整個會話視頻解釋了他們如何創建該界面。

我使用了類似的方法在Emojicate應用程序中創建鍵盤。

我認為我所做的實際上是假的粘性標題。 所以像這樣......

1. 僅使用一個集合視圖。
2. 創建包含三個數據源的“分段數據源”。 （參見WWDC關於此的視頻）
3. 更改分段控件后，通過更改其布局和（如果需要） dataSource更新集合視圖。
4. 使整個頂部部分成為集合視圖上的標題。
5. 當集合視圖滾動到某個點（當你想粘貼標題時），然后有第二個視圖，它是壓縮標題，並使其在屏幕頂部可見。 這根本沒有附加到集合視圖。

當分段控件更改時，您可以通過更改“選定數據源”來更新集合視圖。 數據源還可以包含將更新它的UICollectionViewLayout 。

基本上，您正在談論的tableview只是一個集合視圖，其中單元格寬度等於屏幕寬度。 即偽造一張桌子。

粘性標題根本不粘。 當它開始離開屏幕時，你可以在那里放一個假的標題。

它需要一個重復的（ish）視圖，並考慮如何構建數據，但我認為這比擁有多個集合視圖和頁面控制器和東西更容易，資源更少。

如果您希望我更詳細地了解它，請告訴我，但這是一個復雜的主題。 先觀看視頻。

Answer 2

我會把這個部分變成導航欄。 應該比較容易。 只需使用barButtonItem自定義后退按鈕，並在titleView中執行幾個標簽。

我會將下一部分作為表視圖。

tableView有2個部分。 第一部分沒有節標題，第二節沒有任何單元格，只有節標題。

本節中的第一個也是唯一的單元格：

其余的將是第二部分標題的視圖：

這為您提供了所需的粘性，因為即使您滾過它，節標題也會保留在那里，因為集合只有2個部分，控件將始終保持在頂部。

我認為收集/表分頁部分是最難的部分，我不清楚它是如何完成的。 但我認為它可能是一個ContainerView。 容器視圖的每個視圖都可以是tableview或collectionview。 您將不得不添加一些代碼來處理containerview相對於第二個節頭的移動（可能是一個自動布局約束，它將容器視圖附加到您在上面實現的第一個表視圖的底部）。

我不認為在scrollview中使用你的表/集合是一個很好的實現。 我想我甚至在文檔中讀到開發人員應該遠離那個（但我可能會錯誤地記住它）。

Answer 3

我會：

• 帶有三個子視圖的“標題視圖”：

  • 固定高度頂部和底部視圖（它們在任何尺寸下都可見）。

  • 隨着超視圖增長/縮小而出現/消失的中間視圖。

• 滾動視圖（表或集合視圖是子類）在其上部分覆蓋標題視圖， 頂部插入設置足以顯示基礎標題視圖（顯示拉動刷新視圖的相同方式）。

  • 分頁按鈕可以設置為表/集合視圖節標題視圖。

最后跟蹤滾動視圖的滾動位置以保持手動調整標題視圖高度。

---

另一種看待此解決方案的方法。

• 兩個完全分離的部分，標題視圖和表格視圖。

  1. 一個簡單的標題視圖（藍色），用於調整其子視圖的高度變化。 更精確的是當它收縮時隱藏它的中間子視圖（淺藍色）。
  2. a）部分覆蓋“接口”構建器中的標題視圖但 b）的表視圖具有頂部插入，以避免將標題視圖隱藏在實際設備中（ tableView.contentInset = UIEdgeInsetsMake(60.0f, 0.0f, 0.0f, 0.0f); ）。

• 當表格視圖向上/向下滾動時，通過調整頁眉視圖高度來僅僅“連接”這兩個部分。