我应该如何构建这个视图？

Question

我很难找到构建此设计的最佳方法。

顶视图有一个最低高度，当它达到此高度时变得粘稠。底部视图托管一个包含三个视图的寻呼控制器。这些视图中的每一个都拥有垂直滚动的集合视图或表视图。

我对如何解决这个问题非常茫然。整个视图是否可滚动，我应该防止在第二个视图上滚动，直到顶视图达到粘滞高度？或者，这些视图中的每一个都将可视化视图分开，而且页面控制器只是一个单元格？我是否应该使用分页控制器，还是应该使用scrollview并启用分页？ （后者有点粗糙的互动方式）

谢谢！

Answer 1

看看WWDC今年的Advanced User Interfaces using 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。你将不得不添加一些代码来处理容器视图相对于第二节头的移动（可能是一个将容器视图附加到上面实现的第一个tableview的按钮上的自动布局约束）。

我不认为你的表/集合在滚动视图将是一个很好的实现。我想我甚至在文档中看过开发者应该远离它（但我可能会错误地记住它）。

Answer 3

我会：

• A “标头视图” 有三个子视图：

  • 固定高度的顶部和底部的意见（他们在任何规模的保持可见）。

  • 时出现的中间视图/消失作为上海华生长/收缩。

• 滚动视图（表或集合视图是子类）上部分地覆盖与设置足以露出下面的标题视图（相同的方式拉刷新视图的顶部边界头部视图，揭示）。

  • 可以将分页按钮设置为表/集合视图节标题视图。

最后跟踪滚动视图的滚动位置手动保持调整页眉视图高度。

---

查看此解决方案的另一种方法。

• 两个完全分开的部分，一个标题视图和一个表视图。

  1. 一个简单的标题视图（蓝色），用于调整其子视图的高度更改。更精确地说，当它收缩时隐藏它的中间子视图（浅蓝色）。
  2. a）部分覆盖“接口”构建器中的页眉视图但 b）的顶视图，以避免隐藏实际设备中的页眉视图（tableView.contentInset = UIEdgeInsetsMake(60.0f, 0.0f, 0.0f, 0.0f);）。

• 这两个部分只是在表格视图向上/向下滚动时通过调整标题视图高度来“连接”。