嵌套多个CollectionView

时间:2019-05-21 12:30:31

标签: ios swift uiview uiscrollview uicollectionview

我正在以以下方式构建布局。

enter image description here

层次结构如下:

view
|
|__CollectionView (CV1), vertical scroll
         |__ CV1.SimpleCell1
         |__ CV1.SimpleCell ...
         |__ CV1.SimpleCell 9
         |
         |__CV1.Complex
                |
                |__ScrollView, horizontal scroll
                        |
                        |__CollectionView2 (CV2), horizontal scroll
                        |           |
                        |           |__n Titles
                        |
                        |__CollectionView3 (CV3), vertical scroll only
                                    |
                                    |__n images

有一个带有垂直滚动的maincollection视图,其标题是图像,并且具有几个具有正常视觉效果的简单单元格。在大约9个单元格之后,我希望在视图的一部分中向用户展示另一个可滚动的滚动条,该滚动条可以分页或自由显示具有标题和分配给该标题的collecitonview(由图像组成)的水平滚动。现在,用户应该能够来回滚动,并且仍然可以垂直滚动以访问更多图像。下面是相同的表示。 我真的不能在这里找出视图的正确可能的实现。另外,如果我在父collectionview单元格中嵌入了动态collectionview,则不确定高度将如何动态变化。

enter image description here

该体系结构的整体图是:

enter image description here

我真的很期待一些指导。我为此一直发疯,非常感谢您的帮助。

谢谢。如果需要,请让我知道更多信息。

1 个答案:

答案 0 :(得分:1)

根据您所说,我会做这样的事情;可能不准确,但这是主要思想。

view
|
|__CollectionView Vertical Scrolling or TableView
         |
         |__CV1.Simple Cell
         |__ …
         |__CV1.Simple Cell
         |
         |__CV1.Complex Cell
                |__CollectionView - Titles - Horizontal scroll (no interaction)
                |         |
                |         |__n Title Header Cell
                |
                |__CollectionView - Images - Horizontal scroll
                          |
                          |__n Image Cell

因此,外部集合视图是具有垂直滚动并包含n个单元格的简单集合视图;

  • Complex Cell基本上是包含水平填充的单元格;无需使用UIScrollView,因为我们将使用两个水平的UICollectionView,一个包含标题(“ One”,“ Second” ...),另一个包含图像;设置水平滚动可以在情节提要/ xib中完成,也可以执行collectionView.collectionViewLayout as? UICollectionViewFlowLayout)?.scrollDirection = .horizontal
  • Complex Cell是两个集合视图的dataSourcedelegate
  • Title Collection View必须具有isUserInteractionEnabled = false(用户无法用手指滚动标题);
  • 目标是在Title Collection View的基础上滚动Image Collection View;您可以使用scrollViewDidScroll的一种方法UICollectionViewDelegate(记住UICollectionViewDelegate扩展了UIScrollViewDelegate

要考虑的其他事项:

  • Complex Cell应该具有固定的大小(在这种情况下,可能是非常复杂的句柄动态大小)
  • 您可以通过使用UITableView而不是UICollectionView来进行垂直滚动来简化操作,但是这将不允许您为Simple Cell设置网格布局